@summeruse/ol 0.1.6 → 0.2.0-alpha.0

package/es/components/index.d.ts

@@ -1,3 +1 @@
-export * from './n-ol-contextmenu';
-export * from './n-ol-pointermove';
 export * from './ol-map';

package/es/composables/index.d.ts

@@ -1,4 +1,6 @@
+export * from './useContextmenu';
 export * from './useDrawLineString';
 export * from './useDrawPolygon';
 export * from './useGraticule';
+export * from './usePointermove';
 export * from './useSwitchBaseLayer';

package/es/composables/useContextmenu/index.d.ts

@@ -0,0 +1,71 @@
+import { Coordinate } from 'ol/coordinate';
+import { FeatureLike } from 'ol/Feature';
+import { MaybeRefOrGetter, VNodeChild } from 'vue';
+import { LayerLike, OLMap } from '../../types';
+export interface ContextmenuPosition {
+    x: number;
+    y: number;
+}
+interface ContextmenuItemParams {
+    map: OLMap;
+    coordinate: Coordinate;
+    position: ContextmenuPosition;
+    feature?: FeatureLike;
+    layer?: LayerLike;
+}
+export interface ContextmenuItemBase {
+    label: ((params: ContextmenuItemParams) => VNodeChild) | string;
+    visible?: ((params: ContextmenuItemParams) => boolean) | boolean;
+    disabled?: ((params: ContextmenuItemParams) => boolean) | boolean;
+    action?: (params: ContextmenuItemParams) => void;
+    divided?: boolean;
+    icon?: ((params: ContextmenuItemParams) => VNodeChild) | string;
+    order?: number;
+    key?: string | number;
+    [key: string]: any;
+}
+export interface ContextmenuItem extends ContextmenuItemBase {
+    children?: Array<ContextmenuItem>;
+}
+export type ContextmenuList = ContextmenuItem[];
+export interface ContextmenuOptionBase {
+    label: string | (() => VNodeChild);
+    visible?: boolean;
+    disabled?: boolean;
+    action: () => void;
+    divided?: boolean;
+    icon?: string | (() => VNodeChild);
+    order?: number;
+    key?: string | number;
+    [key: string]: any;
+}
+export interface ContextmenuOption extends ContextmenuOptionBase {
+    children?: Array<ContextmenuOption>;
+}
+export type ContextmenuOptions = ContextmenuOption[];
+export declare function useContextmenu(mapRef: MaybeRefOrGetter<OLMap | undefined>, items: MaybeRefOrGetter<ContextmenuList>): {
+    visible: import('vue').ComputedRef<boolean>;
+    position: import('vue').ComputedRef<{
+        x: number;
+        y: number;
+    }>;
+    feature: import('vue').ComputedRef<FeatureLike | undefined>;
+    options: import('vue').ComputedRef<{
+        [x: string]: any;
+        children?: /*elided*/ any[] | undefined;
+        label: string | (() => VNodeChild);
+        visible?: boolean | undefined;
+        disabled?: boolean | undefined;
+        action: () => void;
+        divided?: boolean | undefined;
+        icon?: string | (() => VNodeChild) | undefined;
+        order?: number | undefined;
+        key?: string | number | undefined;
+    }[]>;
+    coordinate: import('vue').ComputedRef<Coordinate | undefined>;
+    hide: () => void;
+};
+export type UseContextmenuReturn = ReturnType<typeof useContextmenu>;
+export type UseContextmenuParams = Parameters<typeof useContextmenu>;
+export type UseContextmenuFn = (...args: UseContextmenuParams) => UseContextmenuReturn;
+export {};

package/es/composables/useContextmenu/index.mjs

@@ -0,0 +1,77 @@
+import { ref as u, watch as A, toValue as y, onBeforeUnmount as C, computed as l } from "vue";
+function P(g, L) {
+  const a = u(!1), d = u({ x: 0, y: 0 }), v = u(), b = u([]), h = u();
+  let i;
+  function p(t, n) {
+    const s = [];
+    return t.filter((e) => {
+      const o = e.visible;
+      return typeof o == "function" ? o(n) : o ?? !0;
+    }).filter((e) => !e.children || e.children.length > 0).sort((e, o) => (e.order ?? 0) - (o.order ?? 0)).forEach((e) => {
+      const o = e.icon, r = e.label;
+      s.push({
+        ...e,
+        children: e.children ? p(e.children, n) : void 0,
+        visible: !0,
+        action: () => {
+          var f;
+          (f = e.action) == null || f.call(e, n), c();
+        },
+        icon: typeof o == "function" ? () => o(n) : o,
+        label: typeof r == "function" ? () => r(n) : r,
+        disabled: typeof e.disabled == "function" ? e.disabled(n) : e.disabled ?? !1
+      });
+    }), s;
+  }
+  function E(t) {
+    if (t.preventDefault(), !i)
+      return;
+    const n = i.getEventCoordinate(t);
+    h.value = n;
+    const s = i.getEventPixel(t);
+    let e, o;
+    i.forEachFeatureAtPixel(s, (k, w) => (e = k, o = w, !0)), v.value = e;
+    const [r, f] = [t.clientX, t.clientY];
+    d.value = { x: r, y: f }, b.value = p(y(L), {
+      map: i,
+      position: { ...d.value },
+      coordinate: n,
+      feature: e,
+      layer: o
+    }), a.value = !0;
+  }
+  function c() {
+    a.value = !1;
+  }
+  function V(t) {
+    if (!t)
+      return;
+    const n = t.getViewport();
+    n.addEventListener("contextmenu", E), n.addEventListener("click", c);
+  }
+  function x(t) {
+    if (!t)
+      return;
+    const n = t.getViewport();
+    n.removeEventListener("contextmenu", E), n.removeEventListener("click", c);
+  }
+  return A(
+    () => y(g),
+    (t, n) => {
+      n !== t && (x(n), V(t), i = t);
+    },
+    { immediate: !0 }
+  ), C(() => {
+    x(i);
+  }), {
+    visible: l(() => a.value),
+    position: l(() => d.value),
+    feature: l(() => v.value),
+    options: l(() => b.value),
+    coordinate: l(() => h.value),
+    hide: c
+  };
+}
+export {
+  P as useContextmenu
+};

package/es/composables/usePointermove/index.d.ts

@@ -0,0 +1,57 @@
+import { Coordinate } from 'ol/coordinate';
+import { FeatureLike } from 'ol/Feature';
+import { CSSProperties, MaybeRefOrGetter, VNodeChild } from 'vue';
+import { LayerLike, OLMap } from '../../types';
+export interface PointermovePosition {
+    x: number;
+    y: number;
+}
+interface PointermoveContentParams {
+    map: OLMap;
+    coordinate: Coordinate;
+    position: PointermovePosition;
+    feature: FeatureLike;
+    layer?: LayerLike;
+}
+type Cursor = CSSProperties['cursor'];
+export type PointermoveItem<T extends Option = Option> = {
+    /** 提示内容，支持函数动态生成 */
+    content: ((params: PointermoveContentParams) => VNodeChild) | string;
+    /** 是否显示提示，可根据 feature 动态判断 */
+    visible?: ((params: PointermoveContentParams) => boolean) | boolean;
+    /** 位置偏移 */
+    offset?: {
+        x?: number;
+        y?: number;
+    };
+    /** 优先级，数字越大优先级越高，当多个 tooltip 匹配时，显示优先级最高的 */
+    priority?: number;
+    /** 鼠标样式，如 'pointer', 'crosshair', 'move' 等 */
+    cursor?: Cursor | ((params: PointermoveContentParams) => Cursor);
+    /** 固定在feature center  */
+    fixedFeatureCenter?: boolean;
+} & T;
+export type PointermoveList<T extends Option = Option> = PointermoveItem<T>[];
+export interface Option {
+    [key: string]: any;
+}
+export declare function usePointermove<T extends Option>(mapRef: MaybeRefOrGetter<OLMap | undefined>, items: MaybeRefOrGetter<PointermoveList<T>>): {
+    visible: import('vue').ComputedRef<boolean>;
+    position: import('vue').ComputedRef<{
+        x: number;
+        y: number;
+    }>;
+    originalPosition: import('vue').ComputedRef<{
+        x: number;
+        y: number;
+    }>;
+    feature: import('vue').ComputedRef<FeatureLike | undefined>;
+    content: import('vue').ComputedRef<string | (() => VNodeChild) | undefined>;
+    coordinate: import('vue').ComputedRef<Coordinate | undefined>;
+    option: import('vue').ComputedRef<T | undefined>;
+    hide: () => void;
+};
+export type UsePointermoveReturn = ReturnType<typeof usePointermove>;
+export type UsePointermoveParams<T extends Option> = Parameters<typeof usePointermove<T>>;
+export type UsePointermoveFn<T extends Option> = (...args: UsePointermoveParams<T>) => UsePointermoveReturn;
+export {};

package/es/composables/usePointermove/index.mjs

@@ -0,0 +1,100 @@
+import { getCenter as D } from "ol/extent";
+import { ref as c, computed as s, watch as H, toValue as A, onBeforeUnmount as I } from "vue";
+function O(G, M) {
+  const d = c(!1), l = c({ x: 0, y: 0 }), y = c(), h = c(), x = c({ x: 0, y: 0 }), w = c(), P = c(), R = s(() => ({
+    x: l.value.x + x.value.x,
+    y: l.value.y + x.value.y
+  }));
+  let t, f = "";
+  function U(e) {
+    const v = A(M).filter((n) => {
+      const r = n.visible;
+      return typeof r == "function" ? r(e) : r ?? !0;
+    });
+    return v.length === 0 ? null : v.sort((n, r) => (r.priority ?? 0) - (n.priority ?? 0))[0];
+  }
+  function b(e) {
+    var X, Y;
+    if (!t)
+      return;
+    const o = t.getEventCoordinate(e);
+    w.value = o;
+    const v = t.getEventPixel(e);
+    let n, r;
+    if (t.forEachFeatureAtPixel(v, (u, p) => (n = u, r = p, !0)), !n) {
+      a();
+      return;
+    }
+    y.value = n;
+    const g = {
+      map: t,
+      position: { x: e.clientX, y: e.clientY },
+      coordinate: o,
+      feature: n,
+      layer: r
+    }, i = U(g);
+    if (i) {
+      const { content: u, cursor: p, visible: E, fixedFeatureCenter: B, offset: S, priority: J, ...z } = i;
+      P.value = { ...z };
+    }
+    if (!i) {
+      a();
+      return;
+    }
+    const j = ((X = i.offset) == null ? void 0 : X.x) ?? 0, k = ((Y = i.offset) == null ? void 0 : Y.y) ?? 0;
+    x.value = { x: j, y: k };
+    const q = i.fixedFeatureCenter ?? !0, V = n.getGeometry();
+    if (q && V) {
+      const u = V.getExtent(), p = D(u), E = t.getPixelFromCoordinate(p), { top: B, left: S } = t.getViewport().getBoundingClientRect();
+      l.value.x = E[0] + S, l.value.y = E[1] + B;
+    } else
+      l.value = { x: e.clientX, y: e.clientY };
+    const m = i.content;
+    h.value = typeof m == "function" ? () => m(g) : m;
+    const C = i.cursor, L = typeof C == "function" ? C(g) : C;
+    if (L && t) {
+      const u = t.getViewport();
+      f || (f = u.style.cursor), u.style.cursor = L;
+    }
+    d.value = !0;
+  }
+  function a() {
+    if (d.value = !1, y.value = void 0, t && f !== void 0) {
+      const e = t.getViewport();
+      e.style.cursor = f, f = "";
+    }
+  }
+  function _(e) {
+    if (!e)
+      return;
+    const o = e.getViewport();
+    o.addEventListener("pointermove", b), o.addEventListener("pointerout", a);
+  }
+  function F(e) {
+    if (!e)
+      return;
+    const o = e.getViewport();
+    o.removeEventListener("pointermove", b), o.removeEventListener("pointerout", a);
+  }
+  return H(
+    () => A(G),
+    (e, o) => {
+      o !== e && (F(o), _(e), t = e);
+    },
+    { immediate: !0 }
+  ), I(() => {
+    F(t);
+  }), {
+    visible: s(() => d.value),
+    position: s(() => R.value),
+    originalPosition: s(() => l.value),
+    feature: s(() => y.value),
+    content: s(() => h.value),
+    coordinate: s(() => w.value),
+    option: s(() => P.value),
+    hide: a
+  };
+}
+export {
+  O as usePointermove
+};

package/es/index.mjs

@@ -1,32 +1,30 @@
-import { default as r } from "./components/n-ol-contextmenu/index.vue.mjs";
-import { default as a } from "./components/n-ol-pointermove/index.vue.mjs";
-import { default as i } from "./components/ol-map/index.vue.mjs";
-import { olMapInjectionKey as c, useOlMap as g } from "./components/ol-map/props.mjs";
-import { useDrawLineString as x } from "./composables/useDrawLineString/index.mjs";
-import { useDrawPolygon as P } from "./composables/useDrawPolygon/index.mjs";
-import { useGraticule as p } from "./composables/useGraticule/index.mjs";
+import { default as r } from "./components/ol-map/index.vue.mjs";
+import { olMapInjectionKey as a, useOlMap as n } from "./components/ol-map/props.mjs";
+import { useContextmenu as c } from "./composables/useContextmenu/index.mjs";
+import { useDrawLineString as g } from "./composables/useDrawLineString/index.mjs";
+import { useDrawPolygon as x } from "./composables/useDrawPolygon/index.mjs";
+import { useGraticule as P } from "./composables/useGraticule/index.mjs";
+import { usePointermove as S } from "./composables/usePointermove/index.mjs";
 import { useSwitchBaseLayer as s } from "./composables/useSwitchBaseLayer/index.mjs";
 import { ONE_NM as M } from "./constants/distance.mjs";
 import { EPSG_3857 as y, EPSG_4326 as G, WGS84Projection as L, WebMercatorProjection as _ } from "./constants/projection.mjs";
-import { getAngle as F, getArea as O, getCenter as w, getDestinationPoint as D, getExtentCenter as N, getLineLength as d } from "./utils/calculate/index.mjs";
-import { kmToNauticalMiles as W, nauticalMilesToKm as j } from "./utils/distance/index.mjs";
+import { getAngle as F, getArea as w, getCenter as D, getDestinationPoint as O, getExtentCenter as A, getLineLength as W } from "./utils/calculate/index.mjs";
+import { kmToNauticalMiles as N, nauticalMilesToKm as d } from "./utils/distance/index.mjs";
 import { createCircle as B, createCircleFeature as K, createFeature as b, createLineString as k, createLineStringFeature as v, createMultiLineString as I, createMultiLineStringFeature as R, createMultiPoint as U, createMultiPointFeature as V, createMultiPolygon as q, createMultiPolygonFeature as z, createPoint as H, createPointFeature as J, createPolygon as Q, createPolygonFeature as X } from "./utils/feature/index.mjs";
 import { toOlAngle as Z, toTurfAngle as $ } from "./utils/format/index.mjs";
 import { createVectorLayer as te, getBingLayer as re, getOSMLayer as oe, getTianDiTuLayer as ae, getTianDiTuUrl as ne } from "./utils/layer/index.mjs";
-import { EPSG_3857ExtentToEPSG_4326 as le, EPSG_3857ToEPSG_4326 as ce, EPSG_4326ExtentToEPSG_3857 as ge, EPSG_4326ToEPSG_3857 as ue, mercatorExtentToWgs84 as xe, mercatorToWgs84 as me, wgs84ExtentToMercator as Pe, wgs84ToMercator as fe } from "./utils/projection/index.mjs";
-import { getRealCircleCoordinates as Se } from "./utils/realCircle/index.mjs";
+import { EPSG_3857ExtentToEPSG_4326 as ce, EPSG_3857ToEPSG_4326 as le, EPSG_4326ExtentToEPSG_3857 as ge, EPSG_4326ToEPSG_3857 as ue, mercatorExtentToWgs84 as xe, mercatorToWgs84 as me, wgs84ExtentToMercator as Pe, wgs84ToMercator as pe } from "./utils/projection/index.mjs";
+import { getRealCircleCoordinates as fe } from "./utils/realCircle/index.mjs";
 import { createCircleStyle as Ee, createStyle as Me, createTextStyle as Te } from "./utils/style/index.mjs";
 export {
   y as EPSG_3857,
-  le as EPSG_3857ExtentToEPSG_4326,
-  ce as EPSG_3857ToEPSG_4326,
+  ce as EPSG_3857ExtentToEPSG_4326,
+  le as EPSG_3857ToEPSG_4326,
   G as EPSG_4326,
   ge as EPSG_4326ExtentToEPSG_3857,
   ue as EPSG_4326ToEPSG_3857,
-  r as NOlContextmenu,
-  a as NOlPointermove,
   M as ONE_NM,
-  i as OlMap,
+  r as OlMap,
   L as WGS84Projection,
   _ as WebMercatorProjection,
   B as createCircle,
@@ -49,28 +47,30 @@ export {
   Te as createTextStyle,
   te as createVectorLayer,
   F as getAngle,
-  O as getArea,
+  w as getArea,
   re as getBingLayer,
-  w as getCenter,
-  D as getDestinationPoint,
-  N as getExtentCenter,
-  d as getLineLength,
+  D as getCenter,
+  O as getDestinationPoint,
+  A as getExtentCenter,
+  W as getLineLength,
   oe as getOSMLayer,
-  Se as getRealCircleCoordinates,
+  fe as getRealCircleCoordinates,
   ae as getTianDiTuLayer,
   ne as getTianDiTuUrl,
-  W as kmToNauticalMiles,
+  N as kmToNauticalMiles,
   xe as mercatorExtentToWgs84,
   me as mercatorToWgs84,
-  j as nauticalMilesToKm,
-  c as olMapInjectionKey,
+  d as nauticalMilesToKm,
+  a as olMapInjectionKey,
   Z as toOlAngle,
   $ as toTurfAngle,
-  x as useDrawLineString,
-  P as useDrawPolygon,
-  p as useGraticule,
-  g as useOlMap,
+  c as useContextmenu,
+  g as useDrawLineString,
+  x as useDrawPolygon,
+  P as useGraticule,
+  n as useOlMap,
+  S as usePointermove,
   s as useSwitchBaseLayer,
   Pe as wgs84ExtentToMercator,
-  fe as wgs84ToMercator
+  pe as wgs84ToMercator
 };

package/es/types/index.d.ts

@@ -1,2 +1,4 @@
 import { Map as OLMap } from 'ol';
 export type { OLMap };
+export type ForEachFeatureAtPixelCallbackOptions = Parameters<Parameters<OLMap['forEachFeatureAtPixel']>[1]>;
+export type LayerLike = ForEachFeatureAtPixelCallbackOptions[1];

package/es/utils/feature/index.mjs

@@ -1,97 +1,97 @@
-import { Feature as i } from "ol";
-import { Point as u, LineString as c, Polygon as a, Circle as l, MultiPoint as f, MultiLineString as g, MultiPolygon as y } from "ol/geom";
-import { createStyle as s } from "../style/index.mjs";
-function m(e) {
-  return new u(e);
+import { Feature as a } from "ol";
+import { Point as l, LineString as g, Polygon as f, Circle as y, MultiPoint as s, MultiLineString as m, MultiPolygon as P } from "ol/geom";
+import { createStyle as F } from "../style/index.mjs";
+function M(e) {
+  return new l(e);
 }
-function P(e) {
-  return new c(e);
+function w(e) {
+  return new g(e);
 }
-function F(e) {
-  return new a(e);
+function S(e) {
+  return new f(e);
 }
-function M(e, t) {
-  return new l(e, t);
+function p(e, t) {
+  return new y(e, t);
 }
-function w(e) {
-  return new f(e);
+function L(e) {
+  return new s(e);
 }
-function S(e) {
-  return new g(e);
+function C(e) {
+  return new m(e);
 }
-function p(e) {
-  return new y(e);
+function O(e) {
+  return new P(e);
 }
 function r(e) {
-  const { styleOptions: t, ...n } = e ?? {}, o = t ? s(t) : n.style;
-  return new i({
-    ...n,
-    style: o
+  const { styleOptions: t, style: n, geometry: o, ...u } = e ?? {}, c = t ? F(t) : n, i = new a({
+    geometry: o,
+    ...u
   });
+  return i.setStyle(c), i;
 }
-function b(e, t) {
-  const n = m(e);
+function d(e, t) {
+  const n = M(e);
   return r({
     ...t,
     geometry: n
   });
 }
-function d(e, t) {
-  const n = P(e);
+function h(e, t) {
+  const n = w(e);
   return r({
     ...t,
     geometry: n
   });
 }
-function h(e, t) {
-  const n = F(e);
+function j(e, t) {
+  const n = S(e);
   return r({
     ...t,
     geometry: n
   });
 }
-function j(e, t, n) {
-  const o = M(e, t);
+function k(e, t, n) {
+  const o = p(e, t);
   return r({
     ...n,
     geometry: o
   });
 }
-function k(e, t) {
-  const n = w(e);
+function q(e, t) {
+  const n = L(e);
   return r({
     ...t,
     geometry: n
   });
 }
-function q(e, t) {
-  const n = S(e);
+function v(e, t) {
+  const n = C(e);
   return r({
     ...t,
     geometry: n
   });
 }
-function v(e, t) {
-  const n = p(e);
+function z(e, t) {
+  const n = O(e);
   return r({
     ...t,
     geometry: n
   });
 }
 export {
-  M as createCircle,
-  j as createCircleFeature,
+  p as createCircle,
+  k as createCircleFeature,
   r as createFeature,
-  P as createLineString,
-  d as createLineStringFeature,
-  S as createMultiLineString,
-  q as createMultiLineStringFeature,
-  w as createMultiPoint,
-  k as createMultiPointFeature,
-  p as createMultiPolygon,
-  v as createMultiPolygonFeature,
-  m as createPoint,
-  b as createPointFeature,
-  F as createPolygon,
-  h as createPolygonFeature
+  w as createLineString,
+  h as createLineStringFeature,
+  C as createMultiLineString,
+  v as createMultiLineStringFeature,
+  L as createMultiPoint,
+  q as createMultiPointFeature,
+  O as createMultiPolygon,
+  z as createMultiPolygonFeature,
+  M as createPoint,
+  d as createPointFeature,
+  S as createPolygon,
+  j as createPolygonFeature
 };

package/lib/components/index.d.ts

@@ -1,3 +1 @@
-export * from './n-ol-contextmenu';
-export * from './n-ol-pointermove';
 export * from './ol-map';

package/lib/composables/index.d.ts

@@ -1,4 +1,6 @@
+export * from './useContextmenu';
 export * from './useDrawLineString';
 export * from './useDrawPolygon';
 export * from './useGraticule';
+export * from './usePointermove';
 export * from './useSwitchBaseLayer';

package/lib/composables/useContextmenu/index.d.ts

@@ -0,0 +1,71 @@
+import { Coordinate } from 'ol/coordinate';
+import { FeatureLike } from 'ol/Feature';
+import { MaybeRefOrGetter, VNodeChild } from 'vue';
+import { LayerLike, OLMap } from '../../types';
+export interface ContextmenuPosition {
+    x: number;
+    y: number;
+}
+interface ContextmenuItemParams {
+    map: OLMap;
+    coordinate: Coordinate;
+    position: ContextmenuPosition;
+    feature?: FeatureLike;
+    layer?: LayerLike;
+}
+export interface ContextmenuItemBase {
+    label: ((params: ContextmenuItemParams) => VNodeChild) | string;
+    visible?: ((params: ContextmenuItemParams) => boolean) | boolean;
+    disabled?: ((params: ContextmenuItemParams) => boolean) | boolean;
+    action?: (params: ContextmenuItemParams) => void;
+    divided?: boolean;
+    icon?: ((params: ContextmenuItemParams) => VNodeChild) | string;
+    order?: number;
+    key?: string | number;
+    [key: string]: any;
+}
+export interface ContextmenuItem extends ContextmenuItemBase {
+    children?: Array<ContextmenuItem>;
+}
+export type ContextmenuList = ContextmenuItem[];
+export interface ContextmenuOptionBase {
+    label: string | (() => VNodeChild);
+    visible?: boolean;
+    disabled?: boolean;
+    action: () => void;
+    divided?: boolean;
+    icon?: string | (() => VNodeChild);
+    order?: number;
+    key?: string | number;
+    [key: string]: any;
+}
+export interface ContextmenuOption extends ContextmenuOptionBase {
+    children?: Array<ContextmenuOption>;
+}
+export type ContextmenuOptions = ContextmenuOption[];
+export declare function useContextmenu(mapRef: MaybeRefOrGetter<OLMap | undefined>, items: MaybeRefOrGetter<ContextmenuList>): {
+    visible: import('vue').ComputedRef<boolean>;
+    position: import('vue').ComputedRef<{
+        x: number;
+        y: number;
+    }>;
+    feature: import('vue').ComputedRef<FeatureLike | undefined>;
+    options: import('vue').ComputedRef<{
+        [x: string]: any;
+        children?: /*elided*/ any[] | undefined;
+        label: string | (() => VNodeChild);
+        visible?: boolean | undefined;
+        disabled?: boolean | undefined;
+        action: () => void;
+        divided?: boolean | undefined;
+        icon?: string | (() => VNodeChild) | undefined;
+        order?: number | undefined;
+        key?: string | number | undefined;
+    }[]>;
+    coordinate: import('vue').ComputedRef<Coordinate | undefined>;
+    hide: () => void;
+};
+export type UseContextmenuReturn = ReturnType<typeof useContextmenu>;
+export type UseContextmenuParams = Parameters<typeof useContextmenu>;
+export type UseContextmenuFn = (...args: UseContextmenuParams) => UseContextmenuReturn;
+export {};

package/lib/composables/useContextmenu/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue");function C(E,x){const f=o.ref(!1),d=o.ref({x:0,y:0}),a=o.ref(),v=o.ref([]),b=o.ref();let i;function p(n,t){const l=[];return n.filter(e=>{const r=e.visible;return typeof r=="function"?r(t):r??!0}).filter(e=>!e.children||e.children.length>0).sort((e,r)=>(e.order??0)-(r.order??0)).forEach(e=>{const r=e.icon,u=e.label;l.push({...e,children:e.children?p(e.children,t):void 0,visible:!0,action:()=>{var s;(s=e.action)==null||s.call(e,t),c()},icon:typeof r=="function"?()=>r(t):r,label:typeof u=="function"?()=>u(t):u,disabled:typeof e.disabled=="function"?e.disabled(t):e.disabled??!1})}),l}function h(n){if(n.preventDefault(),!i)return;const t=i.getEventCoordinate(n);b.value=t;const l=i.getEventPixel(n);let e,r;i.forEachFeatureAtPixel(l,(L,V)=>(e=L,r=V,!0)),a.value=e;const[u,s]=[n.clientX,n.clientY];d.value={x:u,y:s},v.value=p(o.toValue(x),{map:i,position:{...d.value},coordinate:t,feature:e,layer:r}),f.value=!0}function c(){f.value=!1}function g(n){if(!n)return;const t=n.getViewport();t.addEventListener("contextmenu",h),t.addEventListener("click",c)}function y(n){if(!n)return;const t=n.getViewport();t.removeEventListener("contextmenu",h),t.removeEventListener("click",c)}return o.watch(()=>o.toValue(E),(n,t)=>{t!==n&&(y(t),g(n),i=n)},{immediate:!0}),o.onBeforeUnmount(()=>{y(i)}),{visible:o.computed(()=>f.value),position:o.computed(()=>d.value),feature:o.computed(()=>a.value),options:o.computed(()=>v.value),coordinate:o.computed(()=>b.value),hide:c}}exports.useContextmenu=C;