@nuxt/scripts 1.0.0-beta.7 → 1.0.0-rc.10

package/dist/runtime/components/GoogleMaps/ScriptGoogleMaps.d.vue.ts

@@ -1,52 +1,34 @@
-export interface PlaceholderOptions {
-    width?: string | number;
-    height?: string | number;
-    center?: string;
-    zoom?: number;
-    size?: string;
-    scale?: number;
-    format?: 'png' | 'jpg' | 'gif' | 'png8' | 'png32' | 'jpg-baseline';
-    maptype?: 'roadmap' | 'satellite' | 'terrain' | 'hybrid';
-    language?: string;
-    region?: string;
-    markers?: string;
-    path?: string;
-    visible?: string;
-    style?: string;
-    map_id?: string;
-    key?: string;
-    signature?: string;
-}
-import type { HTMLAttributes, ImgHTMLAttributes, InjectionKey, Ref, ReservedProps, ShallowRef } from 'vue';
 import type { ElementScriptTrigger } from '#nuxt-scripts/types';
-export declare const MAP_INJECTION_KEY: InjectionKey<{
-    map: ShallowRef<google.maps.Map | undefined>;
-    mapsApi: Ref<typeof google.maps | undefined>;
-}>;
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+import type { HTMLAttributes, ReservedProps, ShallowRef } from 'vue';
+export { MAP_INJECTION_KEY } from './useGoogleMapsResource.js';
+export interface ScriptGoogleMapsProps {
     /**
      * Defines the trigger event to load the script.
+     * @default ['mouseenter', 'mouseover', 'mousedown']
      */
     trigger?: ElementScriptTrigger;
-    /**
-     * Is Google Maps being rendered above the fold?
-     * This will load the placeholder image with higher priority.
-     */
-    aboveTheFold?: boolean;
     /**
      * Defines the Google Maps API key. Must have access to the Static Maps API as well.
      */
     apiKey?: string;
     /**
      * A latitude / longitude of where to focus the map.
+     *
+     * @deprecated Pass `center` via `mapOptions` instead. The top-level `center`
+     * prop will be removed in a future major version. When both are set,
+     * `mapOptions.center` wins.
+     * @see https://scripts.nuxt.com/docs/migration-guide/v0-to-v1
      */
     center?: google.maps.LatLng | google.maps.LatLngLiteral | `${string},${string}`;
     /**
-     * Should a marker be displayed on the map where the centre is.
+     * Zoom level for the map (0-21). Reactive: changing this will update the map.
+     *
+     * @deprecated Pass `zoom` via `mapOptions` instead. The top-level `zoom`
+     * prop will be removed in a future major version. When both are set,
+     * `mapOptions.zoom` wins.
+     * @see https://scripts.nuxt.com/docs/migration-guide/v0-to-v1
      */
-    centerMarker?: boolean;
+    zoom?: number;
     /**
      * Options for the map.
      */
@@ -56,39 +38,27 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      */
     region?: string;
     /**
-     * Defines the language of the map
+     * Defines the language of the map.
      */
     language?: string;
     /**
-     * Defines the version of google maps js API
+     * Defines the version of google maps js API.
      */
     version?: string;
     /**
      * Defines the width of the map.
+     * @default 640
      */
     width?: number | string;
     /**
-     * Defines the height of the map
+     * Defines the height of the map.
+     * @default 400
      */
     height?: number | string;
-    /**
-     * Customize the placeholder image attributes.
-     *
-     * @see https://developers.google.com/maps/documentation/maps-static/start.
-     */
-    placeholderOptions?: PlaceholderOptions;
-    /**
-     * Customize the placeholder image attributes.
-     */
-    placeholderAttrs?: ImgHTMLAttributes & ReservedProps & Record<string, unknown>;
     /**
      * Customize the root element attributes.
      */
     rootAttrs?: HTMLAttributes & ReservedProps & Record<string, unknown>;
-    /**
-     * Extra Markers to add to the map.
-     */
-    markers?: (`${string},${string}` | google.maps.marker.AdvancedMarkerElementOptions)[];
     /**
      * Map IDs for light and dark color modes.
      * When provided, the map will automatically switch styles based on color mode.
@@ -100,150 +70,92 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     };
     /**
      * Manual color mode control. When provided, overrides auto-detection from @nuxtjs/color-mode.
-     * Accepts 'light', 'dark', or a reactive ref.
-     */
-    colorMode?: "light" | "dark";
-}, {
-    readonly googleMaps: Ref<typeof google.maps | undefined, typeof google.maps | undefined>;
-    readonly map: ShallowRef<google.maps.Map | undefined>;
-    readonly createAdvancedMapMarker: (_options?: google.maps.marker.AdvancedMarkerElementOptions | `${string},${string}`) => Promise<google.maps.marker.AdvancedMarkerElement | undefined>;
-    readonly resolveQueryToLatLang: (query: string) => Promise<google.maps.LatLng | undefined>;
-    readonly importLibrary: {
-        (key: "marker"): Promise<google.maps.MarkerLibrary>;
-        (key: "places"): Promise<google.maps.PlacesLibrary>;
-        (key: "geometry"): Promise<google.maps.GeometryLibrary>;
-        (key: "drawing"): Promise<google.maps.DrawingLibrary>;
-        (key: "visualization"): Promise<google.maps.VisualizationLibrary>;
-        (key: string): Promise<any>;
-    };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    error: () => any;
-    ready: (e: {
-        readonly googleMaps: Ref<typeof google.maps | undefined, typeof google.maps | undefined>;
-        readonly map: ShallowRef<google.maps.Map | undefined>;
-        readonly createAdvancedMapMarker: (_options?: google.maps.marker.AdvancedMarkerElementOptions | `${string},${string}`) => Promise<google.maps.marker.AdvancedMarkerElement | undefined>;
-        readonly resolveQueryToLatLang: (query: string) => Promise<google.maps.LatLng | undefined>;
-        readonly importLibrary: {
-            (key: "marker"): Promise<google.maps.MarkerLibrary>;
-            (key: "places"): Promise<google.maps.PlacesLibrary>;
-            (key: "geometry"): Promise<google.maps.GeometryLibrary>;
-            (key: "drawing"): Promise<google.maps.DrawingLibrary>;
-            (key: "visualization"): Promise<google.maps.VisualizationLibrary>;
-            (key: string): Promise<any>;
-        };
-    }) => any;
-}, string, import("vue").PublicProps, Readonly<{
-    /**
-     * Defines the trigger event to load the script.
-     */
-    trigger?: ElementScriptTrigger;
-    /**
-     * Is Google Maps being rendered above the fold?
-     * This will load the placeholder image with higher priority.
-     */
-    aboveTheFold?: boolean;
-    /**
-     * Defines the Google Maps API key. Must have access to the Static Maps API as well.
-     */
-    apiKey?: string;
-    /**
-     * A latitude / longitude of where to focus the map.
+     * Accepts 'light' or 'dark'.
      */
-    center?: google.maps.LatLng | google.maps.LatLngLiteral | `${string},${string}`;
+    colorMode?: 'light' | 'dark';
+}
+export interface ScriptGoogleMapsExpose {
     /**
-     * Should a marker be displayed on the map where the centre is.
+     * A reference to the loaded Google Maps API namespace (`google.maps`), or
+     * `undefined` if not yet loaded.
      */
-    centerMarker?: boolean;
+    mapsApi: ShallowRef<typeof google.maps | undefined>;
     /**
-     * Options for the map.
-     */
-    mapOptions?: google.maps.MapOptions;
-    /**
-     * Defines the region of the map.
+     * A reference to the loaded Google Maps API namespace, or `undefined` if not
+     * yet loaded.
+     *
+     * @deprecated Use `mapsApi` instead. The `googleMaps` alias will be removed
+     * in a future major version.
+     * @see https://scripts.nuxt.com/docs/migration-guide/v0-to-v1
      */
-    region?: string;
+    googleMaps: ShallowRef<typeof google.maps | undefined>;
     /**
-     * Defines the language of the map
+     * A reference to the Google Map instance, or `undefined` if not yet initialized.
      */
-    language?: string;
+    map: ShallowRef<google.maps.Map | undefined>;
     /**
-     * Defines the version of google maps js API
+     * Utility function to resolve a location query (e.g. "New York, NY") to latitude/longitude coordinates.
+     * Uses a caching mechanism and a server-side proxy to avoid unnecessary client-side API calls.
      */
-    version?: string;
+    resolveQueryToLatLng: (query: string) => Promise<google.maps.LatLng | google.maps.LatLngLiteral | undefined>;
     /**
-     * Defines the width of the map.
+     * Utility function to dynamically import additional Google Maps libraries (e.g. "marker", "places").
+     * Caches imported libraries for efficient reuse.
      */
-    width?: number | string;
+    importLibrary: {
+        (key: 'marker'): Promise<google.maps.MarkerLibrary>;
+        (key: 'places'): Promise<google.maps.PlacesLibrary>;
+        (key: 'geometry'): Promise<google.maps.GeometryLibrary>;
+        (key: 'drawing'): Promise<google.maps.DrawingLibrary>;
+        (key: 'visualization'): Promise<google.maps.VisualizationLibrary>;
+        (key: string): Promise<any>;
+    };
+}
+export interface ScriptGoogleMapsEmits {
     /**
-     * Defines the height of the map
+     * Fired when the Google Maps instance is fully loaded and ready to use. Provides access to the maps API.
      */
-    height?: number | string;
+    ready: [payload: ScriptGoogleMapsExpose];
     /**
-     * Customize the placeholder image attributes.
-     *
-     * @see https://developers.google.com/maps/documentation/maps-static/start.
+     * Fired when the Google Maps script fails to load.
      */
-    placeholderOptions?: PlaceholderOptions;
+    error: [];
+}
+export interface ScriptGoogleMapsSlots {
     /**
-     * Customize the placeholder image attributes.
+     * Default slot for rendering child components (e.g. markers, info windows) that depend on the map being ready.
      */
-    placeholderAttrs?: ImgHTMLAttributes & ReservedProps & Record<string, unknown>;
+    default?: () => any;
     /**
-     * Customize the root element attributes.
+     * Slot displayed while the map is loading. Can be used to show a custom loading indicator.
      */
-    rootAttrs?: HTMLAttributes & ReservedProps & Record<string, unknown>;
+    loading?: () => any;
     /**
-     * Extra Markers to add to the map.
+     * Slot displayed when the script is awaiting user interaction to load (based on the `trigger` prop).
      */
-    markers?: (`${string},${string}` | google.maps.marker.AdvancedMarkerElementOptions)[];
+    awaitingLoad?: () => any;
     /**
-     * Map IDs for light and dark color modes.
-     * When provided, the map will automatically switch styles based on color mode.
-     * Requires @nuxtjs/color-mode or manual colorMode prop.
+     * Slot displayed if the script fails to load.
      */
-    mapIds?: {
-        light?: string;
-        dark?: string;
-    };
+    error?: () => any;
     /**
-     * Manual color mode control. When provided, overrides auto-detection from @nuxtjs/color-mode.
-     * Accepts 'light', 'dark', or a reactive ref.
+     * Slot displayed as a placeholder before the map is ready. Useful for showing a static map or skeleton.
      */
-    colorMode?: "light" | "dark";
-}> & Readonly<{
+    placeholder?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ScriptGoogleMapsProps, ScriptGoogleMapsExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    error: () => any;
+    ready: (payload: ScriptGoogleMapsExpose) => any;
+}, string, import("vue").PublicProps, Readonly<ScriptGoogleMapsProps> & Readonly<{
     onError?: (() => any) | undefined;
-    onReady?: ((e: {
-        readonly googleMaps: Ref<typeof google.maps | undefined, typeof google.maps | undefined>;
-        readonly map: ShallowRef<google.maps.Map | undefined>;
-        readonly createAdvancedMapMarker: (_options?: google.maps.marker.AdvancedMarkerElementOptions | `${string},${string}`) => Promise<google.maps.marker.AdvancedMarkerElement | undefined>;
-        readonly resolveQueryToLatLang: (query: string) => Promise<google.maps.LatLng | undefined>;
-        readonly importLibrary: {
-            (key: "marker"): Promise<google.maps.MarkerLibrary>;
-            (key: "places"): Promise<google.maps.PlacesLibrary>;
-            (key: "geometry"): Promise<google.maps.GeometryLibrary>;
-            (key: "drawing"): Promise<google.maps.DrawingLibrary>;
-            (key: "visualization"): Promise<google.maps.VisualizationLibrary>;
-            (key: string): Promise<any>;
-        };
-    }) => any) | undefined;
+    onReady?: ((payload: ScriptGoogleMapsExpose) => any) | undefined;
 }>, {
     trigger: ElementScriptTrigger;
-    centerMarker: boolean;
     width: number | string;
     height: number | string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    placeholder?: (props: {
-        placeholder: string;
-    }) => any;
-} & {
-    loading?: (props: {}) => any;
-} & {
-    awaitingLoad?: (props: {}) => any;
-} & {
-    error?: (props: {}) => any;
-} & {
-    default?: (props: {}) => any;
-}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ScriptGoogleMapsSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;