astro 4.6.3 → 4.7.0

package/dist/core/config/settings.js

@@ -92,7 +92,9 @@ function createBaseSettings(config) {
     middlewares: { pre: [], post: [] },
     watchFiles: [],
     devToolbarApps: [],
-    timer: new AstroTimer()
+    timer: new AstroTimer(),
+    latestAstroVersion: void 0
+    // Will be set later if applicable when the dev server starts
   };
 }
 async function createSettings(config, cwd) {

package/dist/core/constants.js

@@ -1,4 +1,4 @@
-const ASTRO_VERSION = "4.6.3";
+const ASTRO_VERSION = "4.7.0";
 const REROUTE_DIRECTIVE_HEADER = "X-Astro-Reroute";
 const ROUTE_TYPE_HEADER = "X-Astro-Route-Type";
 const DEFAULT_404_COMPONENT = "astro-default-404";

package/dist/core/create-vite.js

@@ -12,12 +12,12 @@ import {
 } from "../content/index.js";
 import astroInternationalization from "../i18n/vite-plugin-i18n.js";
 import astroPrefetch from "../prefetch/vite-plugin-prefetch.js";
+import astroDevToolbar from "../toolbar/vite-plugin-dev-toolbar.js";
 import astroTransitions from "../transitions/vite-plugin-transitions.js";
 import astroPostprocessVitePlugin from "../vite-plugin-astro-postprocess/index.js";
 import { vitePluginAstroServer } from "../vite-plugin-astro-server/index.js";
 import astroVitePlugin from "../vite-plugin-astro/index.js";
 import configAliasVitePlugin from "../vite-plugin-config-alias/index.js";
-import astroDevToolbar from "../vite-plugin-dev-toolbar/vite-plugin-dev-toolbar.js";
 import envVitePlugin from "../vite-plugin-env/index.js";
 import vitePluginFileURL from "../vite-plugin-fileurl/index.js";
 import astroHeadPlugin from "../vite-plugin-head/index.js";

package/dist/core/dev/dev.js

@@ -1,18 +1,51 @@
 import fs from "node:fs";
 import { green } from "kleur/colors";
 import { performance } from "perf_hooks";
+import { gt, major, minor, patch } from "semver";
 import { attachContentServerListeners } from "../../content/index.js";
 import { telemetry } from "../../events/index.js";
 import * as msg from "../messages.js";
 import { ensureProcessNodeEnv } from "../util.js";
 import { startContainer } from "./container.js";
 import { createContainerWithAutomaticRestart } from "./restart.js";
+import {
+  MAX_PATCH_DISTANCE,
+  fetchLatestAstroVersion,
+  shouldCheckForUpdates
+} from "./update-check.js";
 async function dev(inlineConfig) {
   ensureProcessNodeEnv("development");
   const devStart = performance.now();
   await telemetry.record([]);
   const restart = await createContainerWithAutomaticRestart({ inlineConfig, fs });
   const logger = restart.container.logger;
+  const currentVersion = "4.7.0";
+  const isPrerelease = currentVersion.includes("-");
+  if (!isPrerelease) {
+    try {
+      shouldCheckForUpdates(restart.container.settings.preferences).then(async (shouldCheck) => {
+        if (shouldCheck) {
+          const version = await fetchLatestAstroVersion(restart.container.settings.preferences);
+          if (gt(version, currentVersion)) {
+            restart.container.settings.latestAstroVersion = version;
+            const sameMajor = major(version) === major(currentVersion);
+            const sameMinor = minor(version) === minor(currentVersion);
+            const patchDistance = patch(version) - patch(currentVersion);
+            if (sameMajor && sameMinor && patchDistance < MAX_PATCH_DISTANCE) {
+              return;
+            }
+            logger.warn(
+              "SKIP_FORMAT",
+              msg.newVersionAvailable({
+                latestVersion: version
+              })
+            );
+          }
+        }
+      });
+    } catch (e) {
+    }
+  }
   const devServerAddressInfo = await startContainer(restart.container);
   logger.info(
     "SKIP_FORMAT",
@@ -23,8 +56,7 @@ async function dev(inlineConfig) {
       base: restart.container.settings.config.base
     })
   );
-  const currentVersion = "4.6.3";
-  if (currentVersion.includes("-")) {
+  if (isPrerelease) {
     logger.warn("SKIP_FORMAT", msg.prerelease({ currentVersion }));
   }
   if (restart.container.viteServer.config.server?.fs?.strict === false) {

package/dist/core/dev/restart.js

@@ -29,7 +29,11 @@ function shouldRestartContainer({ settings, inlineConfig, restartInFlight }, cha
     shouldRestart = vite.normalizePath(inlineConfig.configFile) === vite.normalizePath(changedFile);
   } else {
     const normalizedChangedFile = vite.normalizePath(changedFile);
-    shouldRestart = configRE.test(normalizedChangedFile) || preferencesRE.test(normalizedChangedFile);
+    shouldRestart = configRE.test(normalizedChangedFile);
+    if (preferencesRE.test(normalizedChangedFile)) {
+      shouldRestart = settings.preferences.ignoreNextPreferenceReload ? false : true;
+      settings.preferences.ignoreNextPreferenceReload = false;
+    }
   }
   if (!shouldRestart && settings.watchFiles.length > 0) {
     shouldRestart = settings.watchFiles.some(

package/dist/core/dev/update-check.d.ts

@@ -0,0 +1,4 @@
+import type { AstroPreferences } from '../../preferences/index.js';
+export declare const MAX_PATCH_DISTANCE = 5;
+export declare function fetchLatestAstroVersion(preferences: AstroPreferences | undefined): Promise<string>;
+export declare function shouldCheckForUpdates(preferences: AstroPreferences): Promise<boolean>;

package/dist/core/dev/update-check.js

@@ -0,0 +1,36 @@
+import ci from "ci-info";
+import { fetchPackageJson } from "../../cli/install-package.js";
+const MAX_PATCH_DISTANCE = 5;
+const CHECK_MS_INTERVAL = 10368e5;
+let _latestVersion = void 0;
+async function fetchLatestAstroVersion(preferences) {
+  if (_latestVersion) {
+    return _latestVersion;
+  }
+  const packageJson = await fetchPackageJson(void 0, "astro", "latest");
+  if (packageJson instanceof Error) {
+    throw packageJson;
+  }
+  const version = packageJson?.version;
+  if (!version) {
+    throw new Error("Failed to fetch latest Astro version");
+  }
+  if (preferences) {
+    await preferences.set("_variables.lastUpdateCheck", Date.now(), { reloadServer: false });
+  }
+  _latestVersion = version;
+  return version;
+}
+async function shouldCheckForUpdates(preferences) {
+  if (ci.isCI) {
+    return false;
+  }
+  const timeSinceLastCheck = Date.now() - await preferences.get("_variables.lastUpdateCheck");
+  const hasCheckUpdatesEnabled = await preferences.get("checkUpdates.enabled");
+  return timeSinceLastCheck > CHECK_MS_INTERVAL && process.env.ASTRO_DISABLE_UPDATE_CHECK !== "true" && hasCheckUpdatesEnabled;
+}
+export {
+  MAX_PATCH_DISTANCE,
+  fetchLatestAstroVersion,
+  shouldCheckForUpdates
+};

package/dist/core/logger/core.d.ts

@@ -7,7 +7,7 @@ export type LoggerLevel = 'debug' | 'info' | 'warn' | 'error' | 'silent';
  * rather than specific to a single command, function, use, etc. The label will be
  * shown in the log message to the user, so it should be relevant.
  */
-export type LoggerLabel = 'add' | 'build' | 'check' | 'config' | 'content' | 'deprecated' | 'markdown' | 'router' | 'types' | 'vite' | 'watch' | 'middleware' | 'preferences' | 'redirects' | 'toolbar' | 'assets' | 'SKIP_FORMAT';
+export type LoggerLabel = 'add' | 'build' | 'check' | 'config' | 'content' | 'deprecated' | 'markdown' | 'router' | 'types' | 'vite' | 'watch' | 'middleware' | 'preferences' | 'redirects' | 'toolbar' | 'assets' | 'update' | 'SKIP_FORMAT';
 export interface LogOptions {
     dest: LogWritable<LogMessage>;
     level: LoggerLevel;

package/dist/core/messages.d.ts

@@ -23,6 +23,9 @@ export declare function serverShortcuts({ key, label }: {
     key: string;
     label: string;
 }): string;
+export declare function newVersionAvailable({ latestVersion }: {
+    latestVersion: string;
+}): string;
 export declare function telemetryNotice(): string;
 export declare function telemetryEnabled(): string;
 export declare function preferenceEnabled(name: string): string;

package/dist/core/messages.js

@@ -14,6 +14,7 @@ import {
   underline,
   yellow
 } from "kleur/colors";
+import { getExecCommand } from "../cli/install-package.js";
 import { getDocsForError, renderErrorMarkdown } from "./errors/dev/utils.js";
 import {
   AstroError,
@@ -36,7 +37,7 @@ function serverStart({
   host,
   base
 }) {
-  const version = "4.6.3";
+  const version = "4.7.0";
   const localPrefix = `${dim("\u2503")} Local    `;
   const networkPrefix = `${dim("\u2503")} Network  `;
   const emptyPrefix = " ".repeat(11);
@@ -69,6 +70,13 @@ function serverStart({
 function serverShortcuts({ key, label }) {
   return [dim("  Press"), key, dim("to"), label].join(" ");
 }
+function newVersionAvailable({ latestVersion }) {
+  const badge = bgYellow(black(` update `));
+  const headline = yellow(`\u25B6 New version of Astro available: ${latestVersion}`);
+  const execCommand = getExecCommand();
+  const details = `  Run ${cyan(`${execCommand} @astrojs/upgrade`)} to update`;
+  return ["", `${badge} ${headline}`, details, ""].join("\n");
+}
 function telemetryNotice() {
   const headline = blue(`\u25B6 Astro collects anonymous usage data.`);
   const why = "  This information helps us improve Astro.";
@@ -261,7 +269,7 @@ function printHelp({
     message.push(
       linebreak(),
       `  ${bgGreen(black(` ${commandName} `))} ${green(
-        `v${"4.6.3"}`
+        `v${"4.7.0"}`
       )} ${headline}`
     );
   }
@@ -291,6 +299,7 @@ export {
   formatErrorMessage,
   fsStrictWarning,
   getNetworkLogging,
+  newVersionAvailable,
   preferenceDefault,
   preferenceDefaultIntro,
   preferenceDisabled,

package/dist/integrations/index.d.ts

@@ -5,6 +5,34 @@ import type { AstroAdapter, AstroConfig, AstroSettings, RouteData } from '../@ty
 import type { SerializedSSRManifest } from '../core/app/types.js';
 import type { PageBuildData } from '../core/build/types.js';
 import type { Logger } from '../core/logger/core.js';
+export declare function getToolbarServerCommunicationHelpers(server: ViteDevServer): {
+    /**
+     * Send a message to the dev toolbar that an app can listen for. The payload can be any serializable data.
+     * @param event - The event name
+     * @param payload - The payload to send
+     */
+    send: <T>(event: string, payload: T) => void;
+    /**
+     * Receive a message from a dev toolbar app.
+     * @param event
+     * @param callback
+     */
+    on: <T_1>(event: string, callback: (data: T_1) => void) => void;
+    /**
+     * Fired when an app is initialized.
+     * @param appId - The id of the app that was initialized
+     * @param callback - The callback to run when the app is initialized
+     */
+    onAppInitialized: (appId: string, callback: (data: Record<string, never>) => void) => void;
+    /**
+     * Fired when an app is toggled on or off.
+     * @param appId - The id of the app that was toggled
+     * @param callback - The callback to run when the app is toggled
+     */
+    onAppToggled: (appId: string, callback: (data: {
+        state: boolean;
+    }) => void) => void;
+};
 export declare function runHookConfigSetup({ settings, command, logger, isRestart, }: {
     settings: AstroSettings;
     command: 'dev' | 'build' | 'preview';

package/dist/integrations/index.js

@@ -33,6 +33,43 @@ function getLogger(integration, logger) {
   Loggers.set(integration, integrationLogger);
   return integrationLogger;
 }
+const serverEventPrefix = "astro-dev-toolbar";
+function getToolbarServerCommunicationHelpers(server) {
+  return {
+    /**
+     * Send a message to the dev toolbar that an app can listen for. The payload can be any serializable data.
+     * @param event - The event name
+     * @param payload - The payload to send
+     */
+    send: (event, payload) => {
+      server.hot.send(event, payload);
+    },
+    /**
+     * Receive a message from a dev toolbar app.
+     * @param event
+     * @param callback
+     */
+    on: (event, callback) => {
+      server.hot.on(event, callback);
+    },
+    /**
+     * Fired when an app is initialized.
+     * @param appId - The id of the app that was initialized
+     * @param callback - The callback to run when the app is initialized
+     */
+    onAppInitialized: (appId, callback) => {
+      server.hot.on(`${serverEventPrefix}:${appId}:initialized`, callback);
+    },
+    /**
+     * Fired when an app is toggled on or off.
+     * @param appId - The id of the app that was toggled
+     * @param callback - The callback to run when the app is toggled
+     */
+    onAppToggled: (appId, callback) => {
+      server.hot.on(`${serverEventPrefix}:${appId}:toggled`, callback);
+    }
+  };
+}
 async function runHookConfigSetup({
   settings,
   command,
@@ -219,7 +256,8 @@ async function runHookServerSetup({
         hookName: "astro:server:setup",
         hookResult: integration.hooks["astro:server:setup"]({
           server,
-          logger: getLogger(integration, logger)
+          logger: getLogger(integration, logger),
+          toolbar: getToolbarServerCommunicationHelpers(server)
         }),
         logger
       });
@@ -384,6 +422,7 @@ function isFunctionPerRouteEnabled(adapter) {
   }
 }
 export {
+  getToolbarServerCommunicationHelpers,
   isFunctionPerRouteEnabled,
   runHookBuildDone,
   runHookBuildGenerated,

package/dist/preferences/defaults.d.ts

@@ -3,5 +3,14 @@ export declare const DEFAULT_PREFERENCES: {
         /** Specifies whether the user has the Dev Overlay enabled */
         enabled: boolean;
     };
+    checkUpdates: {
+        /** Specifies whether the user has the update check enabled */
+        enabled: boolean;
+    };
+    _variables: {
+        /** Time since last update check */
+        lastUpdateCheck: number;
+    };
 };
 export type Preferences = typeof DEFAULT_PREFERENCES;
+export type PublicPreferences = Omit<Preferences, '_variables'>;

package/dist/preferences/defaults.js

@@ -2,6 +2,15 @@ const DEFAULT_PREFERENCES = {
   devToolbar: {
     /** Specifies whether the user has the Dev Overlay enabled */
     enabled: true
+  },
+  checkUpdates: {
+    /** Specifies whether the user has the update check enabled */
+    enabled: true
+  },
+  // Temporary variables that shouldn't be exposed to the users in the CLI, but are still useful to store in preferences
+  _variables: {
+    /** Time since last update check */
+    lastUpdateCheck: 0
   }
 };
 export {

package/dist/preferences/index.d.ts

@@ -1,5 +1,5 @@
 import type { AstroConfig } from '../@types/astro.js';
-import { type Preferences } from './defaults.js';
+import { type Preferences, type PublicPreferences } from './defaults.js';
 type DotKeys<T> = T extends object ? {
     [K in keyof T]: `${Exclude<K, symbol>}${DotKeys<T[K]> extends never ? '' : `.${DotKeys<T[K]>}`}`;
 }[keyof T] : never;
@@ -7,20 +7,28 @@ export type GetDotKey<T extends Record<string | number, any>, K extends string>
 export type PreferenceLocation = 'global' | 'project';
 export interface PreferenceOptions {
     location?: PreferenceLocation;
+    /**
+     * If `true`, the server will be reloaded after setting the preference.
+     * If `false`, the server will not be reloaded after setting the preference.
+     *
+     * Defaults to `true`.
+     */
+    reloadServer?: boolean;
 }
 type DeepPartial<T> = T extends object ? {
     [P in keyof T]?: DeepPartial<T[P]>;
 } : T;
 export type PreferenceKey = DotKeys<Preferences>;
-export interface PreferenceList extends Record<PreferenceLocation, DeepPartial<Preferences>> {
+export interface PreferenceList extends Record<PreferenceLocation, DeepPartial<PublicPreferences>> {
     fromAstroConfig: DeepPartial<Preferences>;
-    defaults: Preferences;
+    defaults: PublicPreferences;
 }
 export interface AstroPreferences {
     get<Key extends PreferenceKey>(key: Key, opts?: PreferenceOptions): Promise<GetDotKey<Preferences, Key>>;
     set<Key extends PreferenceKey>(key: Key, value: GetDotKey<Preferences, Key>, opts?: PreferenceOptions): Promise<void>;
-    getAll(): Promise<Preferences>;
+    getAll(): Promise<PublicPreferences>;
     list(opts?: PreferenceOptions): Promise<PreferenceList>;
+    ignoreNextPreferenceReload: boolean;
 }
 export declare function isValidKey(key: string): key is PreferenceKey;
 export declare function coerce(key: string, value: unknown): any;

package/dist/preferences/index.js

@@ -37,30 +37,37 @@ function createPreferences(config) {
         return project.get(key) ?? global.get(key) ?? dget(DEFAULT_PREFERENCES, key);
       return stores[location].get(key);
     },
-    async set(key, value, { location = "project" } = {}) {
+    async set(key, value, { location = "project", reloadServer = true } = {}) {
       stores[location].set(key, value);
+      if (!reloadServer) {
+        this.ignoreNextPreferenceReload = true;
+      }
     },
     async getAll() {
-      return Object.assign(
+      const allPrefs = Object.assign(
         {},
         DEFAULT_PREFERENCES,
         stores["global"].getAll(),
         stores["project"].getAll()
       );
+      const { _variables, ...prefs } = allPrefs;
+      return prefs;
     },
     async list() {
+      const { _variables, ...defaultPrefs } = DEFAULT_PREFERENCES;
       return {
         global: stores["global"].getAll(),
         project: stores["project"].getAll(),
         fromAstroConfig: mapFrom(DEFAULT_PREFERENCES, config),
-        defaults: DEFAULT_PREFERENCES
+        defaults: defaultPrefs
       };
       function mapFrom(defaults, astroConfig) {
         return Object.fromEntries(
           Object.entries(defaults).map(([key, _]) => [key, astroConfig[key]])
         );
       }
-    }
+    },
+    ignoreNextPreferenceReload: false
   };
 }
 function getGlobalPreferenceDir() {

package/dist/runtime/client/dev-toolbar/apps/astro.d.ts

@@ -15,6 +15,6 @@ declare const _default: {
     id: string;
     name: string;
     icon: "astro:logo";
-    init(canvas: ShadowRoot, eventTarget: EventTarget): Promise<void>;
+    init(canvas: ShadowRoot, eventTarget: import("../helpers.js").ToolbarAppEventTarget): Promise<void>;
 };
 export default _default;

package/dist/runtime/client/dev-toolbar/apps/astro.js

@@ -59,6 +59,7 @@ var astro_default = {
           link: "https://astro.build/chat"
         }
       ];
+      const hasNewerVersion = window.__astro_dev_toolbar__.latestAstroVersion;
       const windowComponent = createWindowElement(
         `<style>
 				#buttons-container {
@@ -301,6 +302,8 @@ var astro_default = {
 				<section>
 				${astroLogo}
 				<astro-dev-toolbar-badge badge-style="gray" size="large">${window.__astro_dev_toolbar__.version}</astro-dev-toolbar-badge>
+				${hasNewerVersion ? `<astro-dev-toolbar-badge badge-style="green" size="large">${window.__astro_dev_toolbar__.latestAstroVersion} available!</astro-dev-toolbar-badge>
+						` : ""}
 				</section>
 				<astro-dev-toolbar-button id="copy-debug-button">Copy debug info <astro-dev-toolbar-icon icon="copy" /></astro-dev-toolbar-button>
 			</header>

package/dist/runtime/client/dev-toolbar/apps/audit/index.d.ts

@@ -10,6 +10,6 @@ declare const _default: {
     id: string;
     name: string;
     icon: "<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 1 20 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): Promise<void>;
+    init(canvas: ShadowRoot, eventTarget: import("../../helpers.js").ToolbarAppEventTarget): Promise<void>;
 };
 export default _default;

package/dist/runtime/client/dev-toolbar/apps/settings.d.ts

@@ -2,6 +2,6 @@ declare const _default: {
     id: string;
     name: string;
     icon: "gear";
-    init(canvas: ShadowRoot, eventTarget: EventTarget): void;
+    init(canvas: ShadowRoot, eventTarget: import("../helpers.js").ToolbarAppEventTarget): void;
 };
 export default _default;

package/dist/runtime/client/dev-toolbar/apps/xray.d.ts

@@ -2,6 +2,6 @@ declare const _default: {
     id: string;
     name: string;
     icon: "<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"#fff\" d=\"M7.9 1.5v-.4a1.1 1.1 0 0 1 2.2 0v.4a1.1 1.1 0 1 1-2.2 0Zm-6.4 8.6a1.1 1.1 0 1 0 0-2.2h-.4a1.1 1.1 0 0 0 0 2.2h.4ZM12 3.7a1.1 1.1 0 0 0 1.4-.7l.4-1.1a1.1 1.1 0 0 0-2.1-.8l-.4 1.2a1.1 1.1 0 0 0 .7 1.4Zm-9.7 7.6-1.2.4a1.1 1.1 0 1 0 .8 2.1l1-.4a1.1 1.1 0 1 0-.6-2ZM20.8 17a1.9 1.9 0 0 1 0 2.6l-1.2 1.2a1.9 1.9 0 0 1-2.6 0l-4.3-4.2-1.6 3.6a1.9 1.9 0 0 1-1.7 1.2A1.9 1.9 0 0 1 7.5 20L2.7 5a1.9 1.9 0 0 1 2.4-2.4l15 5a1.9 1.9 0 0 1 .2 3.4l-3.7 1.6 4.2 4.3ZM19 18.3 14.6 14a1.9 1.9 0 0 1 .6-3l3.2-1.5L5.1 5.1l4.3 13.3 1.5-3.2a1.9 1.9 0 0 1 3-.6l4.4 4.4.7-.7Z\"/></svg>";
-    init(canvas: ShadowRoot, eventTarget: EventTarget): void;
+    init(canvas: ShadowRoot, eventTarget: import("../helpers.js").ToolbarAppEventTarget): void;
 };
 export default _default;

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

@@ -1,4 +1,5 @@
-import { loadDevToolbarApps } from "astro:dev-toolbar";
+import { loadDevToolbarApps } from "astro:toolbar:internal";
+import { ToolbarAppEventTarget } from "./helpers.js";
 import { settings } from "./settings.js";
 let overlay;
 document.addEventListener("DOMContentLoaded", async () => {
@@ -60,7 +61,7 @@ document.addEventListener("DOMContentLoaded", async () => {
     info: '<svg viewBox="0 0 10 10" style="--fill:var(--fill-default);--fill-default:#3645D9;--fill-hover:#BDC3FF;"><rect width="9" height="9" x=".5" y=".5" fill="var(--fill)" stroke="#13151A" stroke-width="2" rx="1.5"/></svg>'
   };
   const prepareApp = (appDefinition, builtIn) => {
-    const eventTarget = new EventTarget();
+    const eventTarget = new ToolbarAppEventTarget();
     const app = {
       ...appDefinition,
       builtIn,

package/dist/runtime/client/dev-toolbar/helpers.d.ts

@@ -0,0 +1,61 @@
+type NotificationPayload = {
+    state: true;
+    level?: 'error' | 'warn' | 'info';
+} | {
+    state: false;
+};
+type AppStatePayload = {
+    state: boolean;
+};
+type AppToggledEvent = (opts: {
+    state: boolean;
+}) => void;
+type ToolbarPlacementUpdatedEvent = (opts: {
+    placement: 'bottom-left' | 'bottom-center' | 'bottom-right';
+}) => void;
+export declare class ToolbarAppEventTarget extends EventTarget {
+    constructor();
+    /**
+     * Toggle the notification state of the toolbar
+     * @param options - The notification options
+     * @param options.state - The state of the notification
+     * @param options.level - The level of the notification, optional when state is false
+     */
+    toggleNotification(options: NotificationPayload): void;
+    /**
+     * Toggle the app state on or off
+     * @param options - The app state options
+     * @param options.state - The new state of the app
+     */
+    toggleState(options: AppStatePayload): void;
+    /**
+     * Fired when the app is toggled on or off
+     * @param callback - The callback to run when the event is fired, takes an object with the new state
+     */
+    onToggled(callback: AppToggledEvent): void;
+    /**
+     * Fired when the toolbar placement is updated by the user
+     * @param callback - The callback to run when the event is fired, takes an object with the new placement
+     */
+    onToolbarPlacementUpdated(callback: ToolbarPlacementUpdatedEvent): void;
+}
+export declare const serverHelpers: {
+    /**
+     * Send a message to the server, the payload can be any serializable data.
+     *
+     * The server can listen for this message in the `astro:server:config` hook of an Astro integration, using the `toolbar.on` method.
+     *
+     * @param event - The event name
+     * @param payload - The payload to send
+     */
+    send: <T>(event: string, payload: T) => void;
+    /**
+     * Receive a message from the server.
+     * @param event - The event name
+     * @param callback - The callback to run when the event is received.
+     * The payload's content will be passed to the callback as an argument
+     */
+    on: <T_1>(event: string, callback: (data: T_1) => void) => void;
+};
+export type ToolbarServerHelpers = typeof serverHelpers;
+export {};

package/dist/runtime/client/dev-toolbar/helpers.js

@@ -0,0 +1,87 @@
+class ToolbarAppEventTarget extends EventTarget {
+  constructor() {
+    super();
+  }
+  /**
+   * Toggle the notification state of the toolbar
+   * @param options - The notification options
+   * @param options.state - The state of the notification
+   * @param options.level - The level of the notification, optional when state is false
+   */
+  toggleNotification(options) {
+    this.dispatchEvent(
+      new CustomEvent("toggle-notification", {
+        detail: {
+          state: options.state,
+          level: options.state === true ? options.level : void 0
+        }
+      })
+    );
+  }
+  /**
+   * Toggle the app state on or off
+   * @param options - The app state options
+   * @param options.state - The new state of the app
+   */
+  toggleState(options) {
+    this.dispatchEvent(
+      new CustomEvent("app-toggled", {
+        detail: {
+          state: options.state
+        }
+      })
+    );
+  }
+  /**
+   * Fired when the app is toggled on or off
+   * @param callback - The callback to run when the event is fired, takes an object with the new state
+   */
+  onToggled(callback) {
+    this.addEventListener("app-toggled", (evt) => {
+      if (!(evt instanceof CustomEvent))
+        return;
+      callback(evt.detail);
+    });
+  }
+  /**
+   * Fired when the toolbar placement is updated by the user
+   * @param callback - The callback to run when the event is fired, takes an object with the new placement
+   */
+  onToolbarPlacementUpdated(callback) {
+    this.addEventListener("placement-updated", (evt) => {
+      if (!(evt instanceof CustomEvent))
+        return;
+      callback(evt.detail);
+    });
+  }
+}
+const serverHelpers = {
+  /**
+   * Send a message to the server, the payload can be any serializable data.
+   *
+   * The server can listen for this message in the `astro:server:config` hook of an Astro integration, using the `toolbar.on` method.
+   *
+   * @param event - The event name
+   * @param payload - The payload to send
+   */
+  send: (event, payload) => {
+    if (import.meta.hot) {
+      import.meta.hot.send(event, payload);
+    }
+  },
+  /**
+   * Receive a message from the server.
+   * @param event - The event name
+   * @param callback - The callback to run when the event is received.
+   * The payload's content will be passed to the callback as an argument
+   */
+  on: (event, callback) => {
+    if (import.meta.hot) {
+      import.meta.hot.on(event, callback);
+    }
+  }
+};
+export {
+  ToolbarAppEventTarget,
+  serverHelpers
+};