@gui-chat-plugin/google-map 0.3.0

package/dist/vue.js

@@ -0,0 +1,516 @@
+import { samples as se, pluginCore as re } from "./core.js";
+import { TOOL_DEFINITION as je, TOOL_NAME as Be, executeMap as Qe } from "./core.js";
+import { defineComponent as j, ref as g, computed as _, watch as ne, onMounted as ae, onUnmounted as le, createElementBlock as l, openBlock as i, createElementVNode as r, createCommentVNode as f, toDisplayString as d, Fragment as G, renderList as U, createTextVNode as T, normalizeClass as I } from "vue";
+const ie = { class: "w-full h-full bg-white flex flex-col relative" }, ce = { class: "p-4 border-b border-gray-200" }, ue = { class: "text-xl font-bold text-gray-800" }, de = {
+  key: 0,
+  class: "text-gray-600 text-sm"
+}, ge = { class: "flex-1 min-h-0 flex" }, ve = { class: "flex-1 relative" }, me = {
+  key: 1,
+  class: "w-full h-full flex items-center justify-center bg-gray-100"
+}, pe = { class: "text-center p-8" }, fe = ["href"], ye = {
+  key: 2,
+  class: "absolute inset-0 bg-white bg-opacity-75 flex items-center justify-center"
+}, he = {
+  key: 3,
+  class: "absolute bottom-4 left-4 right-4 bg-red-100 border border-red-300 text-red-700 px-4 py-3 rounded"
+}, we = {
+  key: 4,
+  class: "absolute top-4 right-4 flex flex-col gap-1"
+}, be = {
+  key: 0,
+  class: "w-80 border-l border-gray-200 overflow-y-auto"
+}, xe = {
+  key: 0,
+  class: "p-4"
+}, _e = { class: "space-y-3" }, ke = ["onClick"], Me = { class: "font-medium text-gray-800" }, Ce = { class: "text-sm text-gray-600 mt-1" }, Le = {
+  key: 0,
+  class: "flex items-center mt-1"
+}, De = { class: "text-sm text-gray-600" }, Pe = {
+  key: 0,
+  class: "text-gray-400"
+}, Re = {
+  key: 1,
+  class: "p-4"
+}, Ee = { class: "bg-blue-50 rounded-lg p-3 mb-4" }, Se = { class: "text-lg font-medium text-gray-800" }, Ze = { class: "text-gray-600" }, $e = { class: "text-sm text-gray-600 mb-3" }, Oe = { class: "space-y-2" }, Te = ["innerHTML"], Ie = { class: "text-gray-500 mt-1" }, ze = /* @__PURE__ */ j({
+  __name: "View",
+  props: {
+    selectedResult: {},
+    googleMapKey: {},
+    onUpdateResult: { type: Function }
+  },
+  setup(C) {
+    const u = C, k = g(null), n = g(null), b = g(/* @__PURE__ */ new Map()), L = g(null), D = g(null), s = g(null), h = g(null), P = g(!1), R = g(null), M = g([]), y = g(null), Z = g(null), E = g(15), B = _(() => {
+      const e = u.selectedResult?.data?.action;
+      return {
+        showLocation: "Map Location",
+        setCenter: "Map View",
+        setZoom: "Map View",
+        addMarker: "Map Marker",
+        clearMarkers: "Map",
+        findPlaces: "Place Search",
+        getDirections: "Directions"
+      }[e || "showLocation"] || "Map";
+    }), z = _(() => {
+      const e = u.selectedResult?.data;
+      if (!e) return "";
+      switch (e.action) {
+        case "showLocation":
+        case "setCenter":
+        case "addMarker":
+          return N(e.location);
+        case "setZoom":
+          return `Zoom level: ${e.zoom}`;
+        case "findPlaces":
+          return e.searchQuery || e.placeType || "";
+        case "getDirections":
+          return `${e.origin} → ${e.destination}`;
+        default:
+          return "";
+      }
+    }), Q = _(() => M.value.length > 0 || y.value !== null), A = _(() => {
+      const e = u.selectedResult?.data;
+      if (!e?.location) return "";
+      const t = N(e.location);
+      return `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(t)}`;
+    }), N = (e) => e ? typeof e == "string" ? e : `${e.lat}, ${e.lng}` : "", H = () => {
+      const e = [];
+      return b.value.forEach((t, o) => {
+        const a = t.getPosition();
+        a && e.push({
+          id: o,
+          position: { lat: a.lat(), lng: a.lng() },
+          title: t.getTitle() || void 0,
+          label: typeof t.getLabel() == "string" ? t.getLabel() : t.getLabel()?.text
+        });
+      }), e;
+    }, w = (e, t, o) => {
+      if (!u.onUpdateResult) return;
+      const v = {
+        action: u.selectedResult?.data?.action || "showLocation",
+        success: e,
+        center: Z.value || void 0,
+        zoom: E.value,
+        markers: H(),
+        ...o
+      };
+      t && (v.error = t), u.onUpdateResult(v);
+    }, W = () => new Promise((e, t) => {
+      if (typeof google < "u" && google.maps) {
+        e();
+        return;
+      }
+      const o = document.querySelector(
+        'script[src*="maps.googleapis.com"]'
+      );
+      if (o) {
+        o.addEventListener("load", () => e()), o.addEventListener(
+          "error",
+          () => t(new Error("Failed to load Google Maps"))
+        );
+        return;
+      }
+      const a = document.createElement("script");
+      a.src = `https://maps.googleapis.com/maps/api/js?key=${u.googleMapKey}&libraries=places`, a.async = !0, a.defer = !0, a.onload = () => e(), a.onerror = () => t(new Error("Failed to load Google Maps")), document.head.appendChild(a);
+    }), J = async () => {
+      if (!(!k.value || !u.googleMapKey))
+        try {
+          await W();
+          const e = { lat: 35.6812, lng: 139.7671 };
+          n.value = new google.maps.Map(k.value, {
+            center: e,
+            zoom: E.value,
+            mapTypeControl: !0,
+            streetViewControl: !0,
+            fullscreenControl: !0
+          }), h.value = new google.maps.Geocoder(), L.value = new google.maps.places.PlacesService(n.value), D.value = new google.maps.DirectionsService(), s.value = new google.maps.DirectionsRenderer(), s.value.setMap(n.value), n.value.addListener("center_changed", () => {
+            const t = n.value?.getCenter();
+            t && (Z.value = { lat: t.lat(), lng: t.lng() });
+          }), n.value.addListener("zoom_changed", () => {
+            E.value = n.value?.getZoom() || 15;
+          }), u.selectedResult?.data && await V(u.selectedResult.data);
+        } catch (e) {
+          R.value = e instanceof Error ? e.message : "Failed to initialize map";
+        }
+    }, F = async (e) => typeof e != "string" ? e : h.value ? new Promise((t) => {
+      h.value.geocode(
+        { address: e },
+        (o, a) => {
+          if (a === "OK" && o && o[0]) {
+            const v = o[0].geometry.location;
+            t({ lat: v.lat(), lng: v.lng() });
+          } else
+            t(null);
+        }
+      );
+    }) : null, $ = (e, t, o, a) => {
+      const v = new google.maps.Marker({
+        position: e,
+        map: n.value,
+        title: o,
+        label: a ? { text: a, color: "white" } : void 0,
+        animation: google.maps.Animation.DROP
+      });
+      return b.value.set(t, v), v;
+    }, K = () => {
+      b.value.forEach((e) => {
+        e.setMap(null);
+      }), b.value.clear();
+    }, V = async (e) => {
+      if (n.value) {
+        P.value = !0, R.value = null;
+        try {
+          switch (e.action) {
+            case "showLocation":
+            case "setCenter": {
+              if (!e.location)
+                throw new Error("Location is required");
+              const t = await F(e.location);
+              if (!t)
+                throw new Error("Could not find location");
+              if (n.value.setCenter(t), Z.value = t, e.action === "showLocation") {
+                const o = `location_${Date.now()}`;
+                $(
+                  t,
+                  o,
+                  typeof e.location == "string" ? e.location : void 0
+                );
+              }
+              w(!0);
+              break;
+            }
+            case "setZoom": {
+              const t = e.zoom || 15;
+              n.value.setZoom(t), E.value = t, w(!0);
+              break;
+            }
+            case "addMarker": {
+              if (!e.location)
+                throw new Error("Location is required for marker");
+              const t = await F(e.location);
+              if (!t)
+                throw new Error("Could not find location for marker");
+              const o = e.marker?.id || `marker_${Date.now()}`;
+              $(t, o, e.marker?.title, e.marker?.label), w(!0);
+              break;
+            }
+            case "clearMarkers": {
+              K(), s.value?.setDirections({
+                routes: [],
+                request: {}
+              }), M.value = [], y.value = null, w(!0);
+              break;
+            }
+            case "findPlaces": {
+              await X(e.searchQuery, e.placeType);
+              break;
+            }
+            case "getDirections": {
+              if (!e.origin || !e.destination)
+                throw new Error("Origin and destination are required");
+              await Y(
+                e.origin,
+                e.destination,
+                e.travelMode || "DRIVING"
+              );
+              break;
+            }
+          }
+        } catch (t) {
+          const o = t instanceof Error ? t.message : "An error occurred";
+          R.value = o, w(!1, o);
+        } finally {
+          P.value = !1;
+        }
+      }
+    }, X = async (e, t) => {
+      if (!L.value || !n.value) return;
+      const o = n.value.getCenter();
+      if (!o) return;
+      const a = {
+        location: o,
+        radius: 5e3,
+        query: e || t || ""
+      };
+      return t && !e && (a.type = t), new Promise((v) => {
+        L.value.textSearch(
+          a,
+          (x, O) => {
+            if (O === google.maps.places.PlacesServiceStatus.OK && x) {
+              b.value.forEach((c, p) => {
+                p.startsWith("place_") && (c.setMap(null), b.value.delete(p));
+              });
+              const m = x.slice(0, 10).map(
+                (c, p) => {
+                  const S = c.geometry?.location, q = S ? { lat: S.lat(), lng: S.lng() } : { lat: 0, lng: 0 };
+                  return S && $(
+                    q,
+                    `place_${c.place_id}`,
+                    c.name,
+                    String(p + 1)
+                  ), {
+                    placeId: c.place_id || "",
+                    name: c.name || "",
+                    address: c.formatted_address || "",
+                    location: q,
+                    rating: c.rating,
+                    userRatingsTotal: c.user_ratings_total,
+                    types: c.types,
+                    openNow: c.opening_hours?.isOpen?.()
+                  };
+                }
+              );
+              if (M.value = m, y.value = null, m.length > 0) {
+                const c = new google.maps.LatLngBounds();
+                m.forEach((p) => {
+                  c.extend(p.location);
+                }), n.value?.fitBounds(c);
+              }
+              w(!0, void 0, { places: m });
+            } else
+              w(!1, "No places found");
+            v();
+          }
+        );
+      });
+    }, Y = async (e, t, o) => {
+      if (!D.value || !s.value) return;
+      const a = {
+        origin: e,
+        destination: t,
+        travelMode: o
+      };
+      return new Promise((v) => {
+        D.value.route(
+          a,
+          (x, O) => {
+            if (O === google.maps.DirectionsStatus.OK && x) {
+              s.value.setDirections(x);
+              const m = x.routes[0]?.legs[0];
+              if (m) {
+                const c = {
+                  summary: x.routes[0].summary || "",
+                  distance: m.distance?.text || "",
+                  duration: m.duration?.text || "",
+                  startAddress: m.start_address || "",
+                  endAddress: m.end_address || "",
+                  steps: m.steps?.map((p) => ({
+                    instruction: p.instructions || "",
+                    distance: p.distance?.text || "",
+                    duration: p.duration?.text || "",
+                    travelMode: p.travel_mode || ""
+                  })) || [],
+                  polyline: x.routes[0].overview_polyline || ""
+                };
+                y.value = c, M.value = [], w(!0, void 0, { route: c });
+              }
+            } else
+              w(!1, "Could not find directions");
+            v();
+          }
+        );
+      });
+    }, ee = (e) => {
+      n.value && (n.value.setCenter(e.location), n.value.setZoom(17));
+    }, te = () => {
+      if (!n.value) return;
+      const e = n.value.getZoom() || 15;
+      e < 21 && n.value.setZoom(e + 1);
+    }, oe = () => {
+      if (!n.value) return;
+      const e = n.value.getZoom() || 15;
+      e > 1 && n.value.setZoom(e - 1);
+    };
+    return ne(
+      () => u.selectedResult?.data,
+      async (e) => {
+        e && n.value && await V(e);
+      }
+    ), ae(() => {
+      u.googleMapKey && J();
+    }), le(() => {
+      K();
+    }), (e, t) => (i(), l("div", ie, [
+      r("div", ce, [
+        r("h2", ue, d(B.value), 1),
+        z.value ? (i(), l("p", de, d(z.value), 1)) : f("", !0)
+      ]),
+      r("div", ge, [
+        r("div", ve, [
+          C.googleMapKey ? (i(), l("div", {
+            key: 0,
+            ref_key: "mapContainer",
+            ref: k,
+            class: "w-full h-full"
+          }, null, 512)) : (i(), l("div", me, [
+            r("div", pe, [
+              t[0] || (t[0] = r("div", { class: "text-gray-500 mb-4" }, "Google Maps API key not configured", -1)),
+              A.value ? (i(), l("a", {
+                key: 0,
+                href: A.value,
+                target: "_blank",
+                class: "inline-block px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 transition-colors"
+              }, " Open in Google Maps ", 8, fe)) : f("", !0)
+            ])
+          ])),
+          P.value ? (i(), l("div", ye, [...t[1] || (t[1] = [
+            r("div", { class: "text-gray-600" }, "Loading...", -1)
+          ])])) : f("", !0),
+          R.value ? (i(), l("div", he, d(R.value), 1)) : f("", !0),
+          C.googleMapKey && n.value ? (i(), l("div", we, [
+            r("button", {
+              onClick: te,
+              class: "w-8 h-8 bg-white border border-gray-300 rounded shadow text-lg font-bold text-gray-700 hover:bg-gray-100 flex items-center justify-center",
+              title: "Zoom in"
+            }, " + "),
+            r("button", {
+              onClick: oe,
+              class: "w-8 h-8 bg-white border border-gray-300 rounded shadow text-lg font-bold text-gray-700 hover:bg-gray-100 flex items-center justify-center",
+              title: "Zoom out"
+            }, " − ")
+          ])) : f("", !0)
+        ]),
+        Q.value ? (i(), l("div", be, [
+          M.value.length > 0 ? (i(), l("div", xe, [
+            t[3] || (t[3] = r("h3", { class: "font-semibold text-gray-800 mb-3" }, "Search Results", -1)),
+            r("div", _e, [
+              (i(!0), l(G, null, U(M.value, (o) => (i(), l("div", {
+                key: o.placeId,
+                class: "p-3 bg-gray-50 rounded-lg cursor-pointer hover:bg-gray-100 transition-colors",
+                onClick: (a) => ee(o)
+              }, [
+                r("div", Me, d(o.name), 1),
+                r("div", Ce, d(o.address), 1),
+                o.rating ? (i(), l("div", Le, [
+                  t[2] || (t[2] = r("span", { class: "text-yellow-500 mr-1" }, "★", -1)),
+                  r("span", De, [
+                    T(d(o.rating.toFixed(1)) + " ", 1),
+                    o.userRatingsTotal ? (i(), l("span", Pe, " (" + d(o.userRatingsTotal) + ") ", 1)) : f("", !0)
+                  ])
+                ])) : f("", !0),
+                o.openNow !== void 0 ? (i(), l("div", {
+                  key: 1,
+                  class: I([o.openNow ? "text-green-600" : "text-red-600", "text-sm mt-1"])
+                }, d(o.openNow ? "Open now" : "Closed"), 3)) : f("", !0)
+              ], 8, ke))), 128))
+            ])
+          ])) : f("", !0),
+          y.value ? (i(), l("div", Re, [
+            t[6] || (t[6] = r("h3", { class: "font-semibold text-gray-800 mb-3" }, "Directions", -1)),
+            r("div", Ee, [
+              r("div", Se, d(y.value.distance), 1),
+              r("div", Ze, d(y.value.duration), 1)
+            ]),
+            r("div", $e, [
+              r("div", null, [
+                t[4] || (t[4] = r("strong", null, "From:", -1)),
+                T(" " + d(y.value.startAddress), 1)
+              ]),
+              r("div", null, [
+                t[5] || (t[5] = r("strong", null, "To:", -1)),
+                T(" " + d(y.value.endAddress), 1)
+              ])
+            ]),
+            r("div", Oe, [
+              (i(!0), l(G, null, U(y.value.steps, (o, a) => (i(), l("div", {
+                key: a,
+                class: "p-2 bg-gray-50 rounded text-sm"
+              }, [
+                r("div", {
+                  innerHTML: o.instruction,
+                  class: "text-gray-800"
+                }, null, 8, Te),
+                r("div", Ie, d(o.distance) + " · " + d(o.duration), 1)
+              ]))), 128))
+            ])
+          ])) : f("", !0)
+        ])) : f("", !0)
+      ])
+    ]));
+  }
+}), Ae = { class: "text-xs text-gray-600 mt-1 truncate" }, Ne = /* @__PURE__ */ j({
+  __name: "Preview",
+  props: {
+    result: {}
+  },
+  setup(C) {
+    const u = C, k = (s) => s ? typeof s == "string" ? s : `${s.lat.toFixed(4)}, ${s.lng.toFixed(4)}` : "", n = _(() => {
+      const s = u.result.data?.action;
+      return {
+        showLocation: "Map Location",
+        setCenter: "Center Map",
+        setZoom: "Zoom",
+        addMarker: "Add Marker",
+        clearMarkers: "Clear Markers",
+        findPlaces: "Place Search",
+        getDirections: "Directions"
+      }[s || "showLocation"] || "Map";
+    }), b = _(() => {
+      const s = u.result.data;
+      if (!s) return "";
+      switch (s.action) {
+        case "showLocation":
+        case "setCenter":
+        case "addMarker":
+          return k(s.location);
+        case "setZoom":
+          return `Level ${s.zoom}`;
+        case "clearMarkers":
+          return "All markers cleared";
+        case "findPlaces":
+          return s.searchQuery || s.placeType || "Search";
+        case "getDirections": {
+          const h = typeof s.origin == "string" ? s.origin : "Start", P = typeof s.destination == "string" ? s.destination : "End";
+          return `${h} → ${P}`;
+        }
+        default:
+          return k(s.location);
+      }
+    }), L = _(() => {
+      const s = u.result.data?.action;
+      return {
+        showLocation: "bg-blue-50",
+        setCenter: "bg-blue-50",
+        setZoom: "bg-purple-50",
+        addMarker: "bg-green-50",
+        clearMarkers: "bg-gray-50",
+        findPlaces: "bg-yellow-50",
+        getDirections: "bg-orange-50"
+      }[s || "showLocation"] || "bg-blue-50";
+    }), D = _(() => {
+      const s = u.result.data?.action;
+      return {
+        showLocation: "text-blue-600",
+        setCenter: "text-blue-600",
+        setZoom: "text-purple-600",
+        addMarker: "text-green-600",
+        clearMarkers: "text-gray-600",
+        findPlaces: "text-yellow-700",
+        getDirections: "text-orange-600"
+      }[s || "showLocation"] || "text-blue-600";
+    });
+    return (s, h) => (i(), l("div", {
+      class: I(["text-center p-4 rounded", L.value])
+    }, [
+      r("div", {
+        class: I(["font-medium", D.value])
+      }, d(n.value), 3),
+      r("div", Ae, d(b.value), 1)
+    ], 2));
+  }
+}), Fe = {
+  ...re,
+  viewComponent: ze,
+  previewComponent: Ne,
+  samples: se
+}, qe = { plugin: Fe };
+export {
+  Ne as Preview,
+  je as TOOL_DEFINITION,
+  Be as TOOL_NAME,
+  ze as View,
+  qe as default,
+  Qe as executeMap,
+  Fe as plugin,
+  re as pluginCore,
+  se as samples
+};

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@gui-chat-plugin/google-map",
+  "version": "0.3.0",
+  "type": "module",
+  "description": "Google Map location plugin for GUI Chat applications",
+  "author": "receptron",
+  "license": "MIT",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./vue": {
+      "types": "./dist/vue/index.d.ts",
+      "import": "./dist/vue.js",
+      "require": "./dist/vue.cjs"
+    },
+    "./style.css": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build && vue-tsc -p tsconfig.build.json --emitDeclarationOnly",
+    "typecheck": "vue-tsc --noEmit",
+    "lint": "eslint src"
+  },
+  "dependencies": {
+    "gui-chat-protocol": "^0.0.3"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.0.0",
+    "@tailwindcss/vite": "^4.1.0",
+    "@types/google.maps": "^3.58.1",
+    "@typescript-eslint/eslint-plugin": "^8.53.1",
+    "@typescript-eslint/parser": "^8.53.1",
+    "@vitejs/plugin-vue": "^6.0.0",
+    "eslint": "^9.0.0",
+    "eslint-plugin-vue": "^10.0.0",
+    "globals": "^17.1.0",
+    "openai": "^6.16.0",
+    "tailwindcss": "^4.1.0",
+    "typescript": "^5.8.0",
+    "vite": "^7.0.0",
+    "vue": "^3.5.0",
+    "vue-eslint-parser": "^10.0.0",
+    "vue-tsc": "^3.2.3"
+  },
+  "peerDependencies": {
+    "vue": "^3.5.0"
+  }
+}