@heycar/heycars-map 0.1.0

package/dist/main.d.ts

@@ -0,0 +1 @@
+import "./style.css";

package/dist/style.css

@@ -0,0 +1 @@
+._130jqet0{display:flex;flex-direction:column;align-items:center;margin-bottom:-1.6vw}._130jqet1{padding:2.13vw 4.5vw 2.67vw 4.27vw;display:flex;align-items:center;background:linear-gradient(90deg,#79AFFF 0%,#5C8DFF 32%,#507FFF 75%,#4471FF 100%);border-radius:3.2vw}._130jqet2{font-size:3.47vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#fff;line-height:4.8vw;white-space:nowrap}._130jqet3{font-size:2.93vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#eafaf8;line-height:4.27vw;white-space:nowrap;opacity:.8}._130jqet4{margin-left:3.2vw;width:1.44vw;height:2.4vw}._130jqet5{width:.8vw;height:4vw;background:#4C80FF;border-radius:0vw 0vw 26.67vw 26.67vw;z-index:1}._130jqet6{margin-top:-1.5vw;width:3.2vw;height:3.2vw}.tdbf070{width:7.1045vw;height:10.93vw;display:flex}._18fnvd20{display:flex;margin-bottom:-8.135vw;width:16.27vw;height:16.27vw}._21u5t50{display:flex;align-items:center}._21u5t51{margin-left:-2.265vw}._21u5t52{margin-bottom:-2.265vw;margin-left:calc(50% - 2.265vw)}._21u5t53{display:flex;width:4.53vw;height:4.53vw}._21u5t54{font-size:3.47vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#243e66;line-height:4.53vw;white-space:nowrap}.in1agy0{margin-bottom:-.4vw;display:flex;flex-direction:column;align-items:center}.in1agy1{padding:1.07vw 2.4vw 1.6vw 2.67vw;background:#FFFFFF;box-shadow:0 .53vw 2.4vw #3f3f3f33;border-radius:2.13vw}.in1agy2{padding:2.67vw 2.67vw 2.4vw 3.2vw;background:#FFFFFF;box-shadow:0 0 2.67vw #4e556c26;border-radius:4.8vw;font-size:3.2vw;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#1e1e1e;line-height:4.53vw;white-space:nowrap}.in1agy3{font-size:3.2vw;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#1e1e1e;line-height:4.53vw;white-space:nowrap}.in1agy4{font-size:2.4vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#7e7e7e;line-height:3.47vw;white-space:nowrap}.in1agy5{color:#4471ff;font-family:PingFangSC-Medium,PingFang SC;font-weight:500}.in1agy6{margin-top:1.33vw;width:6.192vw;height:7.998vw}.in1agy7{margin-top:2.4vw;width:6.192vw;height:7.998vw}._15yrkbw1{margin-top:1.87vw;margin-bottom:-5.5vw;width:6vw;height:11vw}@keyframes sjs3320{0%{transform:scale(0);opacity:1}33.33%{transform:scale(.5);opacity:1}66.66%{transform:scale(1);opacity:0}to{transform:scale(1);opacity:0}}@keyframes sjs3321{0%{transform:scale(0);opacity:0}33.33%{transform:scale(0);opacity:1}66.66%{transform:scale(.5);opacity:1}to{transform:scale(1);opacity:0}}.sjs3322{display:flex;margin-bottom:-30.935vw;width:61.87vw;height:61.87vw;animation-name:sjs3320;animation-duration:3s;animation-iteration-count:infinite;animation-timing-function:linear}.sjs3323{animation-name:sjs3321}.nb7oxq0{width:100vw;height:100vh}

package/dist/types/amap/marker.d.ts

@@ -0,0 +1,11 @@
+export declare enum AnchorType {
+    topLeft = "top-left",
+    topCenter = "top-center",
+    topRight = "top-right",
+    middleLeft = "middle-left",
+    center = "center",
+    middleRight = "middle-right",
+    bottomLeft = "bottom-left",
+    bottomCenter = "bottom-center",
+    bottomRight = "bottom-right"
+}

package/dist/types/helper.d.ts

@@ -0,0 +1,30 @@
+import "@amap/amap-jsapi-types";
+import { DefineComponent, SetupContext, VNode } from "vue-demi";
+import type { VNodeChildren } from "vue/types/umd";
+import type { ComponentOptionsBase } from "vue/types/v3-component-options";
+import type { ComponentObjectPropsOptions } from "vue/types/v3-component-props";
+import type { ObjectEmitsOptions, Slot } from "vue/types/v3-setup-context";
+export type VNodeChild = VNode | VNodeChildren;
+export type VueNode = VNode | null | undefined;
+type LagecyPropNames<N> = N extends `on${string}` ? never : N;
+export type EmitByProps<T, R = Required<T>> = {
+    [K in keyof R as K extends `on${infer N}` ? Uncapitalize<N> : never]: R[K];
+};
+type RenderFunction = (...args: any[]) => VNodeChild;
+export type SC<P> = Omit<SetupContext<Extract<EmitByProps<P>, ObjectEmitsOptions>>, "slots"> & {
+    slots: {
+        [K in keyof P as Exclude<P[K], undefined> extends RenderFunction ? K extends `on${string}` ? never : K : never]: P[K];
+    } & {
+        default?: Slot;
+    };
+};
+export type SetupOptions<P> = ComponentOptionsBase<P, Empty, Empty, Empty, Empty, Empty, Empty, Extract<EmitByProps<P>, ObjectEmitsOptions>, Extract<keyof EmitByProps<P>, string>, Empty>;
+export type Empty = Record<string, never>;
+export declare function defineFc<P = Empty>(render: (props: P, ctx: SC<P>) => VueNode): DefineComponent<ComponentObjectPropsOptions<P>, Empty, Empty, Empty, Empty, Empty, Empty, Extract<EmitByProps<P, Required<P>>, ObjectEmitsOptions>, Extract<keyof EmitByProps<P, Required<P>>, string>, P, import("vue-demi").ExtractDefaultPropTypes<ComponentObjectPropsOptions<P>>>;
+export declare function defineSetup<P>(setup: (props: P, ctx: SC<P>) => () => VueNode): DefineComponent<ComponentObjectPropsOptions<P>, Empty, Empty, Empty, Empty, Empty, Empty, Extract<EmitByProps<P, Required<P>>, ObjectEmitsOptions>, Extract<keyof EmitByProps<P, Required<P>>, string>, P, import("vue-demi").ExtractDefaultPropTypes<ComponentObjectPropsOptions<P>>>;
+export declare function defineLagecySetup<P>(setup: (props: P, ctx: SC<P>) => () => VueNode): {
+    props: (propNames: LagecyPropNames<keyof P>[]) => DefineComponent<ComponentObjectPropsOptions<P>, Empty, Empty, Empty, Empty, Empty, Empty, Extract<EmitByProps<P, Required<P>>, ObjectEmitsOptions>, Extract<keyof EmitByProps<P, Required<P>>, string>, P, import("vue-demi").ExtractDefaultPropTypes<ComponentObjectPropsOptions<P>>>;
+};
+export declare function Noop(): void;
+export declare const createElement: import("vue-demi").CreateElement;
+export {};

package/dist/types/interface.d.ts

@@ -0,0 +1 @@
+export type Point = [number, number];

package/dist/utils/compare.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="google.maps" />
+import { WatchCallback } from "vue-demi";
+import type { Ref, ShallowRef, WatchOptions } from "vue/types/v3-generated";
+import type { EmitFn } from "vue/types/v3-setup-context";
+import type { EmitByProps } from "../types/helper";
+export declare const deepCompareEqualsForMaps: import("fast-equals").EqualityComparator;
+export declare function createDeepCompareMemoize<T>(): (value: T) => T;
+export declare function useDeepCompareEffectForMaps(callback: () => () => any, dependencies: any[]): void;
+export declare function watchNoneImmediatePostEffectForDeepOption<T>(getOption: () => T, callback: WatchCallback<T, T>, watchOptions?: WatchOptions<false>): import("vue-demi").WatchStopHandle;
+export declare function watchPostEffectForDeepOption<T>(getOption: () => T, callback: WatchCallback<T, T | undefined>, watchOptions?: WatchOptions<true>): import("vue-demi").WatchStopHandle;
+type AnyFunction = (...args: any[]) => any;
+type PickSettableOptions<T, S, K extends keyof T = keyof T> = K extends `set${infer N}` ? Uncapitalize<N> extends S ? {
+    name: Uncapitalize<N>;
+    defaultValue?: T[K] extends AnyFunction ? Parameters<T[K]>[0] : never;
+} : never : never;
+export declare function watchPostEffectForMapProperty<T, P>(targetRef: ShallowRef<T | undefined> | Ref<T | undefined>, props: P, nameOptions: PickSettableOptions<T, keyof P>[], watchOptions?: WatchOptions<true>): void;
+export declare function watchNoneImmediatePostEffectForMapProperty<T, P>(targetRef: ShallowRef<T | undefined> | Ref<T | undefined>, props: P, nameOptions: PickSettableOptions<T, keyof P>[], watchOptions?: WatchOptions<false>): void;
+type NamesRestrict<N, S extends string> = N extends `on${string}` ? Lowercase<N> extends `on${S}` ? N : never : never;
+export declare function watchPostEffectForAMapEvent<T extends AMap.Event, P, E extends string = AMap.EventType>(targetRef: ShallowRef<T | undefined> | Ref<T | undefined>, props: P, emit: EmitFn<EmitByProps<P>>, propertyNames: NamesRestrict<keyof P, E>[]): void;
+export declare function watchPostEffectForGMapEvent<T extends google.maps.MVCObject, P>(targetRef: ShallowRef<T | undefined> | Ref<T | undefined>, props: P, emit: EmitFn<EmitByProps<P>>, propertyNames: NamesRestrict<keyof P, string>[]): void;
+export {};

package/dist/utils/dom.d.ts

@@ -0,0 +1,2 @@
+import type { HTMLAttributes, ImgHTMLAttributes } from "vue/types/jsx";
+export declare const createDom: (tag: string, props?: HTMLAttributes | ImgHTMLAttributes, innerHtml?: string) => HTMLElement;

package/dist/utils/transform.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="google.maps" />
+export declare const vec2lnglat: ([lng, lat]: [number, number]) => google.maps.LatLngLiteral;
+export interface AsteriskItem {
+    type: "normal" | "emphasize";
+    value: string;
+}
+export declare const decodeAsterisk: (encodedValue: string) => AsteriskItem[];
+export declare const property2emitEventName: (propertyName: string) => string;
+export declare const property2mapEventName: (propertyName: string) => string;

package/dist/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/esbuild.mjs

@@ -0,0 +1,40 @@
+import { vanillaExtractPlugin } from "@vanilla-extract/esbuild-plugin";
+import esbuild from "esbuild";
+import { nodeExternalsPlugin } from "esbuild-node-externals";
+import path from "path";
+import unpluginVueJsx from "unplugin-vue-jsx/esbuild";
+/** @typedef {import('esbuild').BuildOptions} BuildOptions */
+
+/**
+ * @typedef Build
+ * @prop {BuildOptions['format']} format
+ * @prop {string} file
+ */
+
+(async () => {
+  /** @type {Build[]} */
+  const builds = [
+    { format: "esm", file: "index.js" },
+    { format: "cjs", file: "index.cjs" },
+  ];
+  for (const { format, file } of builds) {
+    await esbuild.build({
+      entryPoints: ["./src/index.ts"],
+      bundle: true,
+      platform: "neutral",
+      jsx: "preserve",
+      format,
+      outfile: path.join("dist", file),
+      sourcemap: true,
+      target: "es2018",
+      plugins: [
+        nodeExternalsPlugin(),
+        unpluginVueJsx({ sourceMap: false }),
+        vanillaExtractPlugin(),
+      ],
+      loader: {
+        ".svg": "file",
+      },
+    });
+  }
+})();

package/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

package/package.json

@@ -0,0 +1,94 @@
+{
+  "name": "@heycar/heycars-map",
+  "version": "0.1.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite -c vite.config.dev.ts",
+    "dev:lib": "concurrently \"vite build --watch --emptyOutDir false\"  \"tsc --declarationDir dist --emitDeclarationOnly --noEmit false --declaration --watch\"",
+    "build": "rm -rf dist && vite build && tsc --declarationDir dist --emitDeclarationOnly --noEmit false --declaration",
+    "preview": "vite preview"
+  },
+  "types": "./dist/index.d.ts",
+  "module": "./dist/index.js",
+  "main": "./dist/index.cjs",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./dist/style.css": {
+      "import": "./dist/style.css",
+      "require": "./dist/style.css"
+    }
+  },
+  "dependencies": {
+    "@amap/amap-jsapi-loader": "^1.0.1",
+    "@amap/amap-jsapi-types": "^0.0.13",
+    "@googlemaps/js-api-loader": "^1.15.1",
+    "@googlemaps/typescript-guards": "^2.0.3",
+    "fast-equals": "^3.0.3",
+    "lodash-es": "^4.17.21",
+    "vue-demi": "^0.13.11"
+  },
+  "peerDependencies": {
+    "@vue/composition-api": "^1.0.0-rc.1",
+    "vue": "^2.7.0 || >=3.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@vue/composition-api": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^17.3.0",
+    "@commitlint/config-conventional": "^17.3.0",
+    "@commitlint/types": "^17.0.0",
+    "@types/google.maps": "^3.52.0",
+    "@types/lodash-es": "^4.17.6",
+    "@typescript-eslint/eslint-plugin": "^5.52.0",
+    "@typescript-eslint/parser": "^5.52.0",
+    "@vanilla-extract/css": "^1.9.5",
+    "@vanilla-extract/esbuild-plugin": "^2.2.1",
+    "@vanilla-extract/recipes": "^0.3.0",
+    "@vanilla-extract/vite-plugin": "^3.8.0",
+    "@vitejs/plugin-vue": "^4.0.0",
+    "@vitejs/plugin-vue-jsx": "^3.0.0",
+    "@vitejs/plugin-vue2": "^1.1.2",
+    "@vitejs/plugin-vue2-jsx": "^1.0.2",
+    "@vue/eslint-config-typescript": "^11.0.2",
+    "concurrently": "^7.6.0",
+    "eslint": "^8.34.0",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-vue": "^9.9.0",
+    "lint-staged": "^13.1.2",
+    "prettier": "^2.8.4",
+    "simple-git-hooks": "^2.8.1",
+    "typescript": "^4.9.3",
+    "unplugin-vue-jsx": "^0.1.2",
+    "vite": "^4.1.0",
+    "vite-plugin-checker": "^0.5.6",
+    "vite-plugin-eslint": "^1.8.1",
+    "vue": "2.7.14",
+    "vue-tsc": "^1.0.24"
+  },
+  "simple-git-hooks": {
+    "pre-commit": "pnpm exec lint-staged --concurrent false",
+    "commit-msg": "pnpm exec commitlint --edit ${1}"
+  },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx}": [
+      "eslint --fix",
+      "prettier --write"
+    ],
+    "*.{md,json,yml,html,css}": [
+      "prettier --write"
+    ]
+  },
+  "packageManager": "pnpm@7.18.1",
+  "engines": {
+    "node": ">=16.0.0"
+  }
+}

package/public/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/src/App.tsx

@@ -0,0 +1,10 @@
+import { defineComponent } from "vue-demi";
+import { HeycarDemo } from "./components/Demo/HeycarDemo";
+
+export const App = defineComponent({
+  setup() {
+    // return () => <Hello class={"helloclass2"} qyc={2} style={{ color: "red" }} />;
+    // return () => <GBusinessDemo />;
+    return () => <HeycarDemo />;
+  },
+});

package/src/api/driving.ts

@@ -0,0 +1,87 @@
+import { memoize } from "lodash-es";
+import type { ApiMapMeta } from "./geometry";
+
+const getGmapDirectionsService = memoize(() => {
+  return new google.maps.DirectionsService();
+});
+
+const getAmapDriving = memoize((options: AMap.DrivingOptions) => {
+  return new AMap.Driving(options);
+}, JSON.stringify);
+
+const getAmapWalking = memoize((options: AMap.WalkingOptions) => {
+  return new AMap.Walking(options);
+}, JSON.stringify);
+
+export interface ApiDrivingGetAddressProps extends ApiMapMeta {
+  origin: [number, number];
+  destination: [number, number];
+  // ferry?: 0 | 1,
+  // policy?: 0|1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17|18|19|20;
+}
+export const apiDrivingGetAddress = async (
+  props: ApiDrivingGetAddressProps
+): Promise<AMap.DrivingResult | undefined | google.maps.DirectionsResult> => {
+  const { isGoogle, origin, destination } = props;
+  if (!isGoogle) {
+    const amapDriving = getAmapDriving({});
+    return new Promise((resolve, reject) => {
+      amapDriving.search(
+        AMap.LngLat.from(origin),
+        AMap.LngLat.from(destination),
+        { waypoints: [] },
+        (status, result) => {
+          switch (status) {
+            case "complete":
+              return resolve(result as AMap.DrivingResult);
+            case "no_data":
+              return resolve(undefined);
+            default:
+              reject(result as Error);
+          }
+        }
+      );
+    });
+  }
+  const gmapDirectionsService = getGmapDirectionsService();
+  return await gmapDirectionsService.route({
+    origin: { lng: origin[0], lat: origin[1] },
+    destination: { lng: destination[0], lat: destination[1] },
+    travelMode: google.maps.TravelMode.DRIVING,
+  });
+};
+
+export interface ApiWalkingGetAddressProps extends ApiMapMeta {
+  origin: [number, number];
+  destination: [number, number];
+}
+export const apiWalkingGetAddress = async (
+  props: ApiWalkingGetAddressProps
+): Promise<AMap.WalkingResult | undefined | google.maps.DirectionsResult> => {
+  const { isGoogle, origin, destination } = props;
+  if (!isGoogle) {
+    const amapWalking = getAmapWalking({});
+    return new Promise((resolve, reject) => {
+      amapWalking.search(
+        AMap.LngLat.from(origin),
+        AMap.LngLat.from(destination),
+        (status, result) => {
+          switch (status) {
+            case "complete":
+              return resolve(result as AMap.WalkingResult);
+            case "no_data":
+              return resolve(undefined);
+            default:
+              reject(result as Error);
+          }
+        }
+      );
+    });
+  }
+  const gmapDirectionsService = getGmapDirectionsService();
+  return await gmapDirectionsService.route({
+    origin: { lng: origin[0], lat: origin[1] },
+    destination: { lng: destination[0], lat: destination[1] },
+    travelMode: google.maps.TravelMode.WALKING,
+  });
+};

package/src/api/geocoder.ts

@@ -0,0 +1,88 @@
+import { memoize } from "lodash-es";
+import type { ApiMapMeta } from "./geometry";
+
+const getGmapGeocoder = memoize(() => {
+  return new google.maps.Geocoder();
+});
+
+const getAmapGeocoder = memoize((options: AMap.GeocoderOptions) => {
+  return new AMap.Geocoder(options);
+}, JSON.stringify);
+
+// todo: 谷歌大部分接口都是用 placeId
+export interface ApiGeocoderGetAddressProps extends ApiMapMeta {
+  location: [number, number];
+  country?: string;
+  // todo: 谷歌用的是邮政编码
+  city?: string;
+  lang?: string;
+}
+export const apiGeocoderGetAddress = async (
+  props: ApiGeocoderGetAddressProps
+): Promise<AMap.ReGeocoderResult | undefined | google.maps.GeocoderResult[]> => {
+  const { isGoogle, location, country, city, lang } = props;
+  if (!isGoogle) {
+    const amapGeocoder = getAmapGeocoder({ city, lang });
+    return new Promise((resolve, reject) => {
+      amapGeocoder.getAddress(AMap.LngLat.from(location), (status, result) => {
+        switch (status) {
+          case "complete":
+            return resolve(result as AMap.ReGeocoderResult);
+          case "no_data":
+            return resolve(undefined);
+          default:
+            reject(result as Error);
+        }
+      });
+    });
+  }
+  const gmapGeocoder = getGmapGeocoder();
+  const [lng, lat] = location;
+  const { results } = await gmapGeocoder.geocode({
+    location: new google.maps.LatLng({ lng, lat }),
+    language: lang,
+    componentRestrictions: {
+      country,
+      postalCode: city,
+    },
+  });
+  return results;
+};
+
+export interface ApiGeocoderGetAddressProps extends ApiMapMeta {
+  address: string;
+  country?: string;
+  // todo: 谷歌用的是邮政编码
+  city?: string;
+  lang?: string;
+}
+export const apiGeocoderGetLocation = async (
+  props: ApiGeocoderGetAddressProps
+): Promise<AMap.GeocoderResult | undefined | google.maps.GeocoderResult[]> => {
+  const { isGoogle, address, country, city, lang } = props;
+  if (!isGoogle) {
+    const amapGeocoder = getAmapGeocoder({ city, lang });
+    return new Promise((resolve, reject) => {
+      amapGeocoder.getLocation(address, (status, result) => {
+        switch (status) {
+          case "complete":
+            return resolve(result as AMap.GeocoderResult);
+          case "no_data":
+            return resolve(undefined);
+          default:
+            reject(result as Error);
+        }
+      });
+    });
+  }
+  const gmapGeocoder = getGmapGeocoder();
+  const { results } = await gmapGeocoder.geocode({
+    address,
+    language: lang,
+    componentRestrictions: {
+      country,
+      postalCode: city,
+    },
+  });
+  return results;
+};

package/src/api/geometry.ts

@@ -0,0 +1,44 @@
+export interface ApiMapMeta {
+  isGoogle: boolean;
+}
+
+type Point = [number, number];
+const point2latlng = ([lng, lat]: Point): google.maps.LatLngLiteral => ({ lng, lat });
+
+export interface DistanceOfLineProps extends ApiMapMeta {
+  path: Point[];
+}
+export function apiDistanceOfLine(props: DistanceOfLineProps): number {
+  const { path, isGoogle } = props;
+  if (!isGoogle) {
+    return AMap.GeometryUtil.distanceOfLine(path);
+  }
+  return google.maps.geometry.spherical.computeLength(path.map(point2latlng));
+}
+
+export interface IsPointInRingProps extends ApiMapMeta {
+  point: Point;
+  path: Point[];
+}
+export function apiIsPointInRing(props: IsPointInRingProps): boolean {
+  const { point, path, isGoogle } = props;
+  if (!isGoogle) {
+    return AMap.GeometryUtil.isPointInRing(point, path);
+  }
+  const polygon = new google.maps.Polygon({ paths: path.map(point2latlng) });
+  return google.maps.geometry.poly.containsLocation(point2latlng(point), polygon);
+}
+
+export interface IsPointInLineProps extends ApiMapMeta {
+  point: Point;
+  path: Point[];
+  tolerance: number;
+}
+export function apiIsPointInLine(props: IsPointInLineProps): boolean {
+  const { point, path, tolerance, isGoogle } = props;
+  if (!isGoogle) {
+    return AMap.GeometryUtil.isPointOnLine(point, path, tolerance);
+  }
+  const polyline = new google.maps.Polyline({ path: path.map(point2latlng) });
+  return google.maps.geometry.poly.isLocationOnEdge(point2latlng(point), polyline, tolerance);
+}

package/src/api/place.ts

@@ -0,0 +1,107 @@
+import { memoize } from "lodash-es";
+import type { ApiMapMeta } from "./geometry";
+
+const getGmapAutoCompleteService = memoize(() => {
+  return new google.maps.places.AutocompleteService();
+});
+
+const getAmapAutoComplete = memoize((options: AMap.AutoCompleteOptions) => {
+  return new AMap.AutoComplete(options);
+}, JSON.stringify);
+
+const getGmapPlacesService = memoize((map: google.maps.Map) => {
+  return new google.maps.places.PlacesService(map);
+});
+
+const getAmapPlaceSearch = memoize((options: AMap.PlaceSearchOptions) => {
+  return new AMap.PlaceSearch(options);
+}, JSON.stringify);
+
+export interface ApiAutoCompleteSearchProps extends ApiMapMeta {
+  keyword: string;
+  country?: string;
+  city?: string;
+  lang?: string;
+}
+export const apiAutoCompleteSearch = async (
+  props: ApiAutoCompleteSearchProps
+): Promise<AMap.AutocompleteResult | undefined | google.maps.places.AutocompletePrediction[]> => {
+  const { country, city, keyword, lang, isGoogle } = props;
+  if (!isGoogle) {
+    const amapAutoComplete = getAmapAutoComplete({ lang, city });
+    return new Promise((resolve, reject) => {
+      // todo 高德海外怎么传 country ?
+      amapAutoComplete.search(keyword, (status, result) => {
+        console.log("status, result = ", status, result);
+        switch (status) {
+          case "complete":
+            return resolve(result as AMap.AutocompleteResult);
+          case "no_data":
+            return resolve(undefined);
+          default:
+            reject(result as Error);
+        }
+      });
+    });
+  }
+  const gmapAutoCompleteService = getGmapAutoCompleteService();
+  const { predictions } = await gmapAutoCompleteService.getPlacePredictions({
+    input: keyword,
+    language: lang,
+    componentRestrictions: {
+      country,
+      postalCode: city,
+    } as google.maps.places.ComponentRestrictions,
+  });
+  return predictions;
+};
+
+export interface ApiPlaceSearchInBoundsProps extends ApiMapMeta {
+  keyword: string;
+  // 基于矩形的 southWest 和 northEast 的点构造矩形。
+  bounds: [[number, number], [number, number]];
+  // 只有谷歌支持
+  lang?: string;
+  // 谷歌地图必须提供 map 对象
+  map?: google.maps.Map;
+}
+export const apiPlaceSearchInBounds = async (
+  props: ApiPlaceSearchInBoundsProps
+): Promise<AMap.PlaceSearchResult | undefined | google.maps.places.PlaceResult[]> => {
+  const { map, keyword, bounds, lang, isGoogle } = props;
+  const pageSize = 20;
+  if (!isGoogle) {
+    const amapPlaceSearch = getAmapPlaceSearch({ pageSize });
+    return new Promise((resolve, reject) => {
+      amapPlaceSearch.searchInBounds(keyword, new AMap.Bounds(bounds), (status, result) => {
+        console.log("status, result = ", status, result);
+        switch (status) {
+          case "complete":
+            return resolve(result as AMap.PlaceSearchResult);
+          case "no_data":
+            return resolve(undefined);
+          default:
+            reject(result as Error);
+        }
+      });
+    });
+  }
+  if (!map) throw new Error("MyError: should provide google map");
+  const gmapPlacesService = getGmapPlacesService(map);
+  return new Promise<google.maps.places.PlaceResult[]>((resolve, reject) => {
+    const [[south, west], [north, east]] = bounds;
+    gmapPlacesService.textSearch(
+      {
+        bounds: { north, east, south, west },
+        language: lang,
+        query: keyword,
+      },
+      (result, status) => {
+        if (status === google.maps.places.PlacesServiceStatus.NOT_FOUND) return resolve([]);
+        if (status === google.maps.places.PlacesServiceStatus.OK)
+          return resolve(result as google.maps.places.PlaceResult[]);
+        reject(status);
+      }
+    );
+  });
+};

package/src/assets/icons/svg/address-locator.svg

@@ -0,0 +1 @@
+<svg width="26" height="40" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="-39.719%" y1="50%" x2="126.093%" y2="50%" id="prefix__a"><stop stop-color="#79AFFF" offset="0%"/><stop stop-color="#5C8DFF" offset="32.342%"/><stop stop-color="#507FFF" offset="74.853%"/><stop stop-color="#4471FF" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><path d="M11.5 24h3v14.5a1.5 1.5 0 01-3 0V24z" fill="#4C80FF"/><g><circle fill="url(#prefix__a)" cx="13" cy="13" r="13"/><circle fill="#FFF" cx="13" cy="13" r="4"/></g></g></svg>

package/src/assets/icons/svg/arrow-right.svg

@@ -0,0 +1 @@
+<svg width="6" height="10" xmlns="http://www.w3.org/2000/svg"><path d="M1 1l4 4-4 4" stroke="#FFF" stroke-width="2" fill="none" fill-rule="evenodd" opacity=".8"/></svg>

package/src/assets/icons/svg/end-point.svg

@@ -0,0 +1 @@
+<svg width="24" height="31" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="72.339%" y1="50%" x2="0%" y2="50%" id="prefix__a"><stop stop-color="#FF8447" offset="0%"/><stop stop-color="#FF8B4A" offset="50.596%"/><stop stop-color="#FFA95A" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><path d="M12 30.215c2.134 0 3.863-.893 3.863-1.995 0-1.1-1.73-1.994-3.863-1.994-2.134 0-3.863.893-3.863 1.994 0 1.102 1.73 1.995 3.863 1.995z" fill-opacity=".5" fill="#43485A"/><path d="M11 27.006c2.128 0-.9-3.743 5.621-6.643C19.842 18.453 22 14.953 22 10.95 22 4.902 17.075 0 11 0S0 4.902 0 10.95c0 3.918 2.068 7.356 5.177 9.29C11.75 23.284 9.06 27.007 11 27.007z" stroke="#FFF" fill="url(#prefix__a)" transform="translate(1 1.215)"/><text font-family="PingFangSC-Semibold, PingFang SC" font-size="12" font-weight="500" fill="#FFF" transform="translate(1 1.215)"><tspan x="5" y="15.449">终</tspan></text></g></svg>

package/src/assets/icons/svg/passenger-circle.svg

@@ -0,0 +1 @@
+<svg width="61" height="61" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter x="-7.1%" y="-7.1%" width="114.3%" height="114.3%" filterUnits="objectBoundingBox" id="prefix__a"><feOffset in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur stdDeviation=".5" in="shadowOffsetOuter1" result="shadowBlurOuter1"/><feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.277453016 0" in="shadowBlurOuter1"/></filter><circle id="prefix__b" cx="30" cy="30" r="10.5"/></defs><g transform="translate(.405 .264)" fill="none" fill-rule="evenodd"><circle stroke-opacity=".1" stroke="#003DFF" fill-opacity=".15" fill="#4873FE" cx="30" cy="30" r="29.5"/><use fill="#000" filter="url(#prefix__a)" xlink:href="#prefix__b"/><circle stroke="#FFF" stroke-width="2.4" stroke-linejoin="square" fill="#4871F1" cx="30" cy="30" r="9.3"/></g></svg>

package/src/assets/icons/svg/place-circle.svg

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="17px" height="17px" viewBox="0 0 17 17" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>椭圆形</title>
+    <defs>
+        <circle id="path-1" cx="4.5" cy="9.5" r="4.5"></circle>
+        <filter x="-61.1%" y="-61.1%" width="222.2%" height="222.2%" filterUnits="objectBoundingBox" id="filter-2">
+            <feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
+            <feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="1.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"></feComposite>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.20435424 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="1.0" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页-即时用车-拖动光标" transform="translate(-228.000000, -322.000000)">
+            <g id="椭圆形" transform="translate(232.000000, 321.000000)">
+                <use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
+                <use stroke="#FFFFFF" stroke-width="2" fill="#346EFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/assets/icons/svg/start-point.svg

@@ -0,0 +1 @@
+<svg width="24" height="31" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="0%" y1="50%" x2="129.599%" y2="50%" id="prefix__a"><stop stop-color="#36A8FF" offset="0%"/><stop stop-color="#4871F1" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><path d="M12 30.215c1.95 0 3.532-.816 3.532-1.823 0-1.007-1.581-1.823-3.532-1.823-1.95 0-3.532.816-3.532 1.823 0 1.007 1.581 1.823 3.532 1.823z" fill-opacity=".5" fill="#43485A"/><path d="M11 27c2.128 0-.9-3.742 5.621-6.641 3.221-1.91 5.379-5.41 5.379-9.412C22 4.901 17.075 0 11 0S0 4.901 0 10.947c0 3.918 2.068 7.355 5.177 9.29C11.75 23.277 9.06 27 11 27z" stroke="#FFF" fill="url(#prefix__a)" transform="translate(1 1.215)"/><text font-family="PingFangSC-Semibold, PingFang SC" font-size="12" font-weight="500" fill="#FFF" transform="translate(1 1.215)"><tspan x="5" y="15.624">起</tspan></text></g></svg>