@heycar/heycars-map 1.0.0-coordinate7 → 2.0.0-switchMap2

package/dist/v2/hooks/useMapLoader.d.ts

@@ -1,12 +1,13 @@
 import { load as loadAmap } from "@amap/amap-jsapi-loader";
 import { type LoaderOptions } from "@googlemaps/js-api-loader";
 import { type Ref } from "vue-demi";
-import type { VueNode } from "../demi-polyfill";
+import type { VNodeChild } from "../demi-polyfill";
 import type { Language } from "../types/interface";
 export declare const DEFAULT_AMAP_PLUGINS: AmapLoaderProps["plugins"];
 export declare const DEFAULT_GMAP_LIBRARIES: LoaderOptions["libraries"];
 export declare enum Status {
     LOADING = "LOADING",
+    TIMEOUT = "TIMEOUT",
     FAILURE = "FAILURE",
     SUCCESS = "SUCCESS"
 }
@@ -19,32 +20,36 @@ declare global {
         };
     }
 }
-export interface AmapLoaderProps extends Pick<GmapLoaderProps, "fallback" | "loading" | "onChange">, Omit<AMapLoaderOptions, "key" | "version" | "plugins"> {
+export interface AmapLoaderProps extends Pick<GmapLoaderProps, "fallback" | "loading" | "onSuccess" | "onFail">, Omit<AMapLoaderOptions, "key" | "version" | "plugins"> {
     apiKey: string;
     apiSecret?: string;
     apiServiceHost?: string;
     version?: string;
     plugins?: `AMap.${AMap.PluginName}`[];
+    disableRef?: Ref<boolean>;
 }
 export declare const useAmapLoader: (props: AmapLoaderProps) => {
     statusRef: import("vue-demi").ShallowRef<Status>;
     readyPromise: Promise<undefined>;
 };
 export interface GmapLoaderProps extends LoaderOptions {
+    disableRef?: Ref<boolean>;
     /**
      * Render prop used to switch to loading component.
      */
-    loading?: () => VueNode;
+    loading?: () => VNodeChild;
     /**
      * Render prop used to switch to error fallback component.
      */
-    fallback?: () => VueNode;
+    fallback?: () => VNodeChild;
     /**
-     * Callback prop used to access `@googlemaps/js-api-loader` and `Status`.
-     *
-     * Note: The callback be executed multiple times in the lifecycle of the component.
+     * 成功回调只会触发一次
      */
-    onChange?: (status: Status) => void;
+    onSuccess?: () => void;
+    /**
+     * 失败回调可能会触发多次
+     */
+    onFail?: () => void;
 }
 export declare const useGmapLoader: (props: GmapLoaderProps) => {
     statusRef: import("vue-demi").ShallowRef<Status>;
@@ -62,7 +67,8 @@ export interface UseMapLoaderProps {
     amapServiceHost?: string;
     supplier: MapSupplier;
     language: Language;
-    onChange?: (status: Status) => any;
+    onSuccess?: () => void;
+    onFail?: () => void;
 }
 export declare const useMapLoader: (props: UseMapLoaderProps) => UseMapLoaderOutput;
 export {};

package/dist/v2/hooks/useMapLoader.js

@@ -1,6 +1,7 @@
-import { shallowRef, computed } from "vue-demi";
+import { shallowRef, computed, ref } from "vue-demi";
 import { watchPostEffectForDeepOption } from "../utils/compare.js";
 import { createRunOnce } from "../utils/helper.js";
+import { t as throttle } from "../chunks/throttle.8bdd8d3b.js";
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 var distExports = {};
 var dist = {
@@ -537,6 +538,8 @@ class Loader {
     }
   }
 }
+const MIN_MAP_RELOAD_INTERVAL = 5e3;
+const GMAP_LOAD_TIMEOUT = 1e4;
 const DEFAULT_AMAP_PLUGINS = [
   "AMap.Geocoder",
   "AMap.Driving",
@@ -546,12 +549,13 @@ const DEFAULT_AMAP_PLUGINS = [
 const DEFAULT_GMAP_LIBRARIES = ["marker", "geometry"];
 var Status = /* @__PURE__ */ ((Status2) => {
   Status2["LOADING"] = "LOADING";
+  Status2["TIMEOUT"] = "TIMEOUT";
   Status2["FAILURE"] = "FAILURE";
   Status2["SUCCESS"] = "SUCCESS";
   return Status2;
 })(Status || {});
 const useAmapLoader = (props) => {
-  const { onChange } = props;
+  const { disableRef, onSuccess, onFail } = props;
   let resolveLoader;
   let rejectLoader;
   const readyPromise = new Promise((resolve, reject) => {
@@ -563,47 +567,58 @@ const useAmapLoader = (props) => {
     /* LOADING */
   );
   const optionsRef = computed(() => {
-    const { onChange: onChange2, loading, fallback, apiKey, apiSecret, apiServiceHost, version, ...options } = props;
+    const {
+      onSuccess: onSuccess2,
+      onFail: onFail2,
+      loading,
+      fallback,
+      apiKey,
+      apiSecret,
+      apiServiceHost,
+      version,
+      ...options
+    } = props;
     return { ...options, key: apiKey, version: version != null ? version : "2.0" };
   });
-  watchPostEffectForDeepOption(
-    () => optionsRef.value,
+  const defineSecurityOnce = createRunOnce(() => {
+    window._AMapSecurityConfig = props.apiServiceHost ? {
+      serviceHost: props.apiServiceHost
+    } : { securityJsCode: props.apiSecret };
+  });
+  const reload = throttle(
     (options) => {
-      const setStatusAndExecuteCallback = (status) => {
-        statusRef.value = status;
-        if (status === "SUCCESS")
+      if (statusRef.value === "SUCCESS")
+        return;
+      statusRef.value = "LOADING";
+      defineSecurityOnce();
+      return distExports.load(options).then(
+        () => {
+          statusRef.value = "SUCCESS";
           resolveLoader();
-        if (status === "FAILURE")
+          onSuccess == null ? void 0 : onSuccess();
+        },
+        () => {
+          statusRef.value = "FAILURE";
           rejectLoader();
-        onChange == null ? void 0 : onChange(statusRef.value);
-      };
-      setStatusAndExecuteCallback(
-        "LOADING"
-        /* LOADING */
-      );
-      window._AMapSecurityConfig = props.apiServiceHost ? {
-        serviceHost: props.apiServiceHost
-      } : { securityJsCode: props.apiSecret };
-      distExports.load(options).then(
-        () => setStatusAndExecuteCallback(
-          "SUCCESS"
-          /* SUCCESS */
-        ),
-        () => setStatusAndExecuteCallback(
-          "FAILURE"
-          /* FAILURE */
-        )
+          onFail == null ? void 0 : onFail();
+        }
       );
+    },
+    MIN_MAP_RELOAD_INTERVAL,
+    { trailing: false }
+  );
+  watchPostEffectForDeepOption(
+    () => [optionsRef.value, disableRef == null ? void 0 : disableRef.value],
+    ([options, disable]) => {
+      if (disable)
+        return;
+      reload(options);
     }
   );
   return { statusRef, readyPromise };
 };
-const loadGmapOnce = createRunOnce((opts) => {
-  const loader = new Loader(opts);
-  return loader.load();
-});
 const useGmapLoader = (props) => {
-  const { onChange } = props;
+  const { disableRef, onSuccess, onFail } = props;
   let resolveLoader;
   let rejectLoader;
   const readyPromise = new Promise((resolve, reject) => {
@@ -615,56 +630,82 @@ const useGmapLoader = (props) => {
     /* LOADING */
   );
   const optionsRef = computed(() => {
-    const { onChange: onChange2, fallback, loading, language, ...options } = props;
+    const { onSuccess: onSuccess2, onFail: onFail2, fallback, loading, language, ...options } = props;
     return options;
   });
-  watchPostEffectForDeepOption(
-    () => optionsRef.value,
+  const timerRef = ref();
+  const reload = throttle(
     (options) => {
-      const language = navigator.language;
-      const setStatusAndExecuteCallback = (status) => {
-        statusRef.value = status;
-        if (status === "SUCCESS")
+      if (statusRef.value === "SUCCESS")
+        return;
+      const loader = new Loader(options);
+      clearTimeout(timerRef.value);
+      timerRef.value = window.setTimeout(() => {
+        statusRef.value = "TIMEOUT";
+      }, GMAP_LOAD_TIMEOUT);
+      if (loader.status !== LoaderStatus.INITIALIZED) {
+        loader.reset();
+      }
+      statusRef.value = "LOADING";
+      return loader.load().then(
+        () => {
+          clearTimeout(timerRef.value);
+          statusRef.value = "SUCCESS";
           resolveLoader();
-        if (status === "FAILURE")
+          onSuccess == null ? void 0 : onSuccess();
+        },
+        () => {
+          clearTimeout(timerRef.value);
+          statusRef.value = "FAILURE";
           rejectLoader();
-        onChange == null ? void 0 : onChange(statusRef.value);
-      };
-      setStatusAndExecuteCallback(
-        "LOADING"
-        /* LOADING */
-      );
-      loadGmapOnce({ ...options, language }).then(
-        () => setStatusAndExecuteCallback(
-          "SUCCESS"
-          /* SUCCESS */
-        ),
-        () => setStatusAndExecuteCallback(
-          "FAILURE"
-          /* FAILURE */
-        )
+          onFail == null ? void 0 : onFail();
+        }
       );
+    },
+    MIN_MAP_RELOAD_INTERVAL,
+    { trailing: false }
+  );
+  watchPostEffectForDeepOption(
+    () => [optionsRef.value, disableRef == null ? void 0 : disableRef.value],
+    ([options, disable]) => {
+      if (disable)
+        return;
+      const language = navigator.language;
+      reload({ ...options, language });
     }
   );
   return { statusRef, readyPromise };
 };
 const useMapLoader = (props) => {
-  const { gmapKey, amapKey, amapSecret, amapServiceHost, supplier, language, onChange } = props;
-  return supplier === "gmap" ? useGmapLoader({
+  const { gmapKey, amapKey, amapSecret, amapServiceHost, language, onSuccess, onFail } = props;
+  const { statusRef: amapStatusRef, readyPromise: amapReadyPromise } = useAmapLoader({
+    apiKey: amapKey,
+    apiSecret: amapSecret,
+    apiServiceHost: amapServiceHost,
+    plugins: DEFAULT_AMAP_PLUGINS,
+    disableRef: computed(() => props.supplier !== "amap"),
+    onSuccess,
+    onFail
+  });
+  const { statusRef: gmapStatusRef, readyPromise: gmapReadyPromise } = useGmapLoader({
     apiKey: gmapKey,
     language,
     version: "weekly",
     // todo: 需要提前设置 region
     // region: "CN",
     libraries: DEFAULT_GMAP_LIBRARIES,
-    onChange
-  }) : useAmapLoader({
-    apiKey: amapKey,
-    apiSecret: amapSecret,
-    apiServiceHost: amapServiceHost,
-    plugins: DEFAULT_AMAP_PLUGINS,
-    onChange
+    disableRef: computed(() => props.supplier !== "gmap"),
+    onSuccess,
+    onFail
   });
+  return {
+    get statusRef() {
+      return props.supplier === "gmap" ? gmapStatusRef : amapStatusRef;
+    },
+    get readyPromise() {
+      return props.supplier === "gmap" ? gmapReadyPromise : amapReadyPromise;
+    }
+  };
 };
 export {
   DEFAULT_AMAP_PLUGINS,

package/dist/v2/hooks/useMapPlace.js

@@ -3,7 +3,7 @@ import { REGEO_TIMEOUT } from "../api/contants.js";
 import { createPipeTw } from "../utils/cn2tw.js";
 import { equalAssign } from "../utils/helper.js";
 import { amapPlaceName2DisplayName, gmapPlaceName2DisplayName } from "../utils/transform.js";
-import { useAmapInChina } from "./useMapInChina.js";
+import { inChina } from "./useMapInChina.js";
 import { useMapSupplier } from "./useMapSupplier.js";
 import { useUpdate } from "./useUdate.js";
 const useAmapPlace = (props) => {
@@ -11,7 +11,6 @@ const useAmapPlace = (props) => {
   const defaultPoint = [...props.pointRef.value];
   const pointRef = ref(defaultPoint);
   const { readyPromise, language } = useMapSupplier();
-  const { inChina } = useAmapInChina();
   const place = reactive({
     lng: pointRef.value[0],
     lat: pointRef.value[1],

package/dist/v2/hooks/useMapSupplier.d.ts

@@ -4,6 +4,8 @@ export interface MapSupplierPayolad extends UseMapLoaderProps {
     gmapId: string;
     readyPromise: UseMapLoaderOutput["readyPromise"];
     status: Status;
+    renderLoadFailedTitle?: (status: Status) => string | undefined;
+    renderLoadFailedDescription?: (status: Status) => string | undefined;
 }
 export declare const useMapSupplier: () => MapSupplierPayolad;
 export declare const provideMapSupplier: (payload: MapSupplierPayolad) => void;

package/dist/v2/hooks-business/useBusinessAlarm.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @warning: 如果要支持动态地图切换， 外部引用 useBusinessAlarm 的组件必须利用 key={mapSupplier} 强制更新
+ */
 export interface useBusinessAlarmProps {
     emptyPlaceName: string;
 }