@cn-map/gaode-svelte 0.0.0 → 0.0.1

package/dist/control/hawk-eye/hawk-eye.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import type { ControlExtraInitOptions } from '../control'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { controlEvents, useControlAttributes } from '../control'
+
+  type HawkEyeEvents = MapEventProps<AMap.HawkEyeEventType, AMap.HawkEye>
+  type HawkEyeInitOptions = AMap.HawkEyeOptions & ControlExtraInitOptions & Instance<AMap.HawkEye>
+
+  export type HawkEyeProps = HawkEyeInitOptions & HawkEyeEvents
+
+  const hawkEyeEvents: AMap.HawkEyeEventType[] = controlEvents
+
+  let { instance = $bindable(), ...props }: HawkEyeProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(hawkEyeEvents))
+
+  const hawkEye = $state.raw<AMap.HawkEye>(new AMap.HawkEye(snapshot(restProps)))
+
+  $effect(() => {
+    instance = hawkEye
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    map.addControl(hawkEye)
+
+    return () => {
+      map.removeControl(hawkEye)
+    }
+  })
+
+  useControlAttributes(() => hawkEye, restProps)
+
+  createEventListeners<AMap.HawkEyeEventType, AMap.HawkEye>(
+    () => hawkEye,
+    () => props,
+    hawkEyeEvents
+  )
+</script>

package/dist/control/hawk-eye/hawk-eye.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+import type { ControlExtraInitOptions } from '../control';
+type HawkEyeEvents = MapEventProps<AMap.HawkEyeEventType, AMap.HawkEye>;
+type HawkEyeInitOptions = AMap.HawkEyeOptions & ControlExtraInitOptions & Instance<AMap.HawkEye>;
+export type HawkEyeProps = HawkEyeInitOptions & HawkEyeEvents;
+declare const HawkEye: import("svelte").Component<HawkEyeProps, {}, "instance">;
+type HawkEye = ReturnType<typeof HawkEye>;
+export default HawkEye;

package/dist/control/hawk-eye/index.d.ts

@@ -0,0 +1,2 @@
+export { default as HawkEye } from './hawk-eye.svelte';
+export type { HawkEyeProps } from './hawk-eye.svelte';

package/dist/control/hawk-eye/index.js

@@ -0,0 +1 @@
+export { default as HawkEye } from './hawk-eye.svelte';

package/dist/control/index.d.ts

@@ -0,0 +1,6 @@
+export { ControlBar, type ControlBarProps } from './control-bar';
+export { Geolocation, type GeolocationProps } from './geolocation';
+export { HawkEye, type HawkEyeProps } from './hawk-eye';
+export { MapType, type MapTypeProps } from './map-type';
+export { Scale, type ScaleProps } from './scale';
+export { ToolBar, type ToolBarProps } from './tool-bar';

package/dist/control/index.js

@@ -0,0 +1,6 @@
+export { ControlBar } from './control-bar';
+export { Geolocation } from './geolocation';
+export { HawkEye } from './hawk-eye';
+export { MapType } from './map-type';
+export { Scale } from './scale';
+export { ToolBar } from './tool-bar';

package/dist/control/map-type/index.d.ts

@@ -0,0 +1,2 @@
+export { default as MapType } from './map-type.svelte';
+export type { MapTypeProps } from './map-type.svelte';

package/dist/control/map-type/index.js

@@ -0,0 +1 @@
+export { default as MapType } from './map-type.svelte';

package/dist/control/map-type/map-type.svelte

@@ -0,0 +1,54 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import type { ControlExtraInitOptions } from '../control'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { controlEvents, useControlAttributes } from '../control'
+
+  type MapTypeEvents = MapEventProps<AMap.MapTypeEventType, AMap.MapType>
+  type MapTypeInitOptions = AMap.MapTypeOptions & ControlExtraInitOptions & Instance<AMap.MapType>
+
+  export type MapTypeProps = MapTypeInitOptions & MapTypeEvents
+
+  const mapTypeEvents: AMap.MapTypeEventType[] = controlEvents
+
+  let { instance = $bindable(), ...props }: MapTypeProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(mapTypeEvents))
+
+  const mapType = $state.raw<AMap.MapType>(new AMap.MapType(snapshot(restProps)))
+
+  $effect(() => {
+    instance = mapType
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    map.addControl(mapType)
+
+    return () => {
+      mapType._config.layerInfos.forEach(layerInfo => {
+        layerInfo.layer.setMap(null)
+        layerInfo.layer.destroy()
+      })
+      map.removeControl(mapType)
+    }
+  })
+
+  useControlAttributes(() => mapType, restProps)
+
+  createEventListeners<AMap.MapTypeEventType, AMap.MapType>(
+    () => mapType,
+    () => props,
+    mapTypeEvents
+  )
+</script>

package/dist/control/map-type/map-type.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+import type { ControlExtraInitOptions } from '../control';
+type MapTypeEvents = MapEventProps<AMap.MapTypeEventType, AMap.MapType>;
+type MapTypeInitOptions = AMap.MapTypeOptions & ControlExtraInitOptions & Instance<AMap.MapType>;
+export type MapTypeProps = MapTypeInitOptions & MapTypeEvents;
+declare const MapType: import("svelte").Component<MapTypeProps, {}, "instance">;
+type MapType = ReturnType<typeof MapType>;
+export default MapType;

package/dist/control/scale/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Scale } from './scale.svelte';
+export type { ScaleProps } from './scale.svelte';

package/dist/control/scale/index.js

@@ -0,0 +1 @@
+export { default as Scale } from './scale.svelte';

package/dist/control/scale/scale.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import type { ControlExtraInitOptions } from '../control'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { controlEvents, useControlAttributes } from '../control'
+
+  type ScaleEvents = MapEventProps<AMap.ScaleEventType, AMap.Scale>
+  type ScaleInitOptions = AMap.ScaleOptions & ControlExtraInitOptions & Instance<AMap.Scale>
+
+  export type ScaleProps = ScaleInitOptions & ScaleEvents
+
+  const scaleEvents: AMap.ScaleEventType[] = controlEvents
+
+  let { instance = $bindable(), ...props }: ScaleProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(scaleEvents))
+
+  const scale = $state.raw<AMap.Scale>(new AMap.Scale(snapshot(restProps)))
+
+  $effect(() => {
+    instance = scale
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    map.addControl(scale)
+
+    return () => {
+      map.removeControl(scale)
+    }
+  })
+
+  useControlAttributes(() => scale, restProps)
+
+  createEventListeners<AMap.ScaleEventType, AMap.Scale>(
+    () => scale,
+    () => props,
+    scaleEvents
+  )
+</script>

package/dist/control/scale/scale.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+import type { ControlExtraInitOptions } from '../control';
+type ScaleEvents = MapEventProps<AMap.ScaleEventType, AMap.Scale>;
+type ScaleInitOptions = AMap.ScaleOptions & ControlExtraInitOptions & Instance<AMap.Scale>;
+export type ScaleProps = ScaleInitOptions & ScaleEvents;
+declare const Scale: import("svelte").Component<ScaleProps, {}, "instance">;
+type Scale = ReturnType<typeof Scale>;
+export default Scale;

package/dist/control/tool-bar/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ToolBar } from './tool-bar.svelte';
+export type { ToolBarProps } from './tool-bar.svelte';

package/dist/control/tool-bar/index.js

@@ -0,0 +1 @@
+export { default as ToolBar } from './tool-bar.svelte';

package/dist/control/tool-bar/tool-bar.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import type { ControlExtraInitOptions } from '../control'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { controlEvents, useControlAttributes } from '../control'
+
+  type ToolBarEvents = MapEventProps<AMap.ToolBarEventType, AMap.ToolBar>
+  type ToolBarInitOptions = AMap.ToolBarOptions & ControlExtraInitOptions & Instance<AMap.ToolBar>
+
+  export type ToolBarProps = ToolBarInitOptions & ToolBarEvents
+
+  const toolBarEvents: AMap.ToolBarEventType[] = controlEvents
+
+  let { instance = $bindable(), ...props }: ToolBarProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(toolBarEvents))
+
+  const toolBar = $state.raw<AMap.ToolBar>(new AMap.ToolBar(snapshot(restProps)))
+
+  $effect(() => {
+    instance = toolBar
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    map.addControl(toolBar)
+
+    return () => {
+      map.removeControl(toolBar)
+    }
+  })
+
+  useControlAttributes(() => toolBar, restProps)
+
+  createEventListeners<AMap.ToolBarEventType, AMap.ToolBar>(
+    () => toolBar,
+    () => props,
+    toolBarEvents
+  )
+</script>

package/dist/control/tool-bar/tool-bar.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+import type { ControlExtraInitOptions } from '../control';
+type ToolBarEvents = MapEventProps<AMap.ToolBarEventType, AMap.ToolBar>;
+type ToolBarInitOptions = AMap.ToolBarOptions & ControlExtraInitOptions & Instance<AMap.ToolBar>;
+export type ToolBarProps = ToolBarInitOptions & ToolBarEvents;
+declare const ToolBar: import("svelte").Component<ToolBarProps, {}, "instance">;
+type ToolBar = ReturnType<typeof ToolBar>;
+export default ToolBar;

package/dist/hooks/create-event-listeners.svelte.d.ts

@@ -0,0 +1,2 @@
+import type { AccessorLike, MapEventProps, Nullable } from '@cn-map/gaode-shared/types';
+export default function <T extends Exclude<AMap.EventType, AMap.PlaceSearchOnlyEventType>, U extends AMap.Event<T>>(target: AccessorLike<Nullable<U>>, eventProps: AccessorLike<MapEventProps<T, U>>, eventTypes?: T[]): void;

package/dist/hooks/create-event-listeners.svelte.js

@@ -0,0 +1,26 @@
+import { eventToProp, lowercase } from '@cn-map/gaode-shared/utils';
+import { isAccessor } from "../utils/index.js";
+export default function (target, eventProps, eventTypes = []) {
+    function getHandler(eventType) {
+        const props = isAccessor(eventProps) ? eventProps() : eventProps;
+        return props[eventToProp(eventType)];
+    }
+    $effect(() => {
+        const _target = isAccessor(target) ? target() : target;
+        if (!_target)
+            return;
+        const cleanupFunctions = [];
+        for (const eventType of eventTypes) {
+            const handler = event => {
+                getHandler(eventType)?.(event);
+            };
+            _target.on(lowercase(eventType), handler);
+            cleanupFunctions.push(() => {
+                _target.off(lowercase(eventType), handler);
+            });
+        }
+        return () => {
+            cleanupFunctions.forEach(cleanup => cleanup());
+        };
+    });
+}

package/dist/hooks/index.d.ts

@@ -0,0 +1 @@
+export { default as createEventListeners } from './create-event-listeners.svelte';

package/dist/hooks/index.js

@@ -0,0 +1 @@
+export { default as createEventListeners } from './create-event-listeners.svelte';

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+export { APILoader, type APILoaderOptions, type APILoaderProps, LoadStatus, useAPILoader, useAPIStatus, } from './api-loader';
+export { ControlBar, type ControlBarProps, Geolocation, type GeolocationProps, HawkEye, type HawkEyeProps, MapType, type MapTypeProps, Scale, type ScaleProps, ToolBar, type ToolBarProps, } from './control';
+export { Buildings as BuildingLayer, Buildings, type BuildingsProps, CanvasLayer, type CanvasLayerProps, Country, type CountryProps, CustomLayer, type CustomLayerProps, DistrictLayer, type DistrictLayerProps, Flexible, type FlexibleProps, GLCustomLayer, type GLCustomLayerProps, HeatMap, type HeatMapProps, ImageLayer, type ImageLayerProps, IndoorMap, type IndoorMapProps, LabelsLayer, type LabelsLayerProps, LayerGroup, type LayerGroupProps, Mapbox, type MapboxProps, MapboxVectorTileLayer, type MapboxVectorTileLayerProps, Mark, type MarkProps, Province, type ProvinceProps, RoadNet, type RoadNetProps, Satellite, type SatelliteProps, TileLayer, type TileLayerProps, Traffic, type TrafficProps, useLabelsLayer, useVectorLayer, VectorLayer, type VectorLayerProps, WMS, type WMSProps, WMTS, type WMTSProps, World, type WorldProps, } from './layer';
+export { Map, type MapProps, useMap, useMapInstance } from './map';
+export { BezierCurve, type BezierCurveProps, Circle, CircleMarker, type CircleMarkerProps, type CircleProps, ContextMenu, type ContextMenuProps, ElasticMarker, type ElasticMarkerProps, Ellipse, type EllipseProps, IndexCluster, type IndexClusterProps, InfoWindow, type InfoWindowProps, LabelMarker, type LabelMarkerProps, Marker, MarkerCluster, type MarkerClusterProps, type MarkerProps, MassMarks, type MassMarksProps, OverlayGroup, type OverlayGroupProps, Polygon, type PolygonProps, Polyline, type PolylineProps, Rectangle, type RectangleProps, Text, type TextProps, } from './overlay';
+export { BezierCurveEditor, type BezierCurveEditorProps, CircleEditor, type CircleEditorProps, EllipseEditor, type EllipseEditorProps, MouseTool, type MouseToolProps, PolygonEditor, type PolygonEditorProps, PolylineEditor, type PolylineEditorProps, RangingTool, type RangingToolProps, RectangleEditor, type RectangleEditorProps, } from './tool';
+export { omitProps } from './utils';

package/dist/index.js

@@ -0,0 +1,7 @@
+export { APILoader, LoadStatus, useAPILoader, useAPIStatus, } from './api-loader';
+export { ControlBar, Geolocation, HawkEye, MapType, Scale, ToolBar, } from './control';
+export { Buildings as BuildingLayer, Buildings, CanvasLayer, Country, CustomLayer, DistrictLayer, Flexible, GLCustomLayer, HeatMap, ImageLayer, IndoorMap, LabelsLayer, LayerGroup, Mapbox, MapboxVectorTileLayer, Mark, Province, RoadNet, Satellite, TileLayer, Traffic, useLabelsLayer, useVectorLayer, VectorLayer, WMS, WMTS, World, } from './layer';
+export { Map, useMap, useMapInstance } from './map';
+export { BezierCurve, Circle, CircleMarker, ContextMenu, ElasticMarker, Ellipse, IndexCluster, InfoWindow, LabelMarker, Marker, MarkerCluster, MassMarks, OverlayGroup, Polygon, Polyline, Rectangle, Text, } from './overlay';
+export { BezierCurveEditor, CircleEditor, EllipseEditor, MouseTool, PolygonEditor, PolylineEditor, RangingTool, RectangleEditor, } from './tool';
+export { omitProps } from './utils';

package/dist/layer/buildings/buildings.svelte

@@ -0,0 +1,62 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { layerEvents, useLayerAttributes } from '../layer'
+
+  type BuildingsAttributes = Omit<BuildingsInitOptions, 'map' | 'instance'> & {
+    /**
+     * 建筑物图层样式
+     */
+    style?: AMap.BuildingsStyleOptions
+  }
+  type BuildingsEvents = MapEventProps<AMap.BuildingsEventType, AMap.Buildings>
+  type BuildingsInitOptions = AMap.BuildingsOptions & Instance<AMap.Buildings>
+
+  export type BuildingsProps = BuildingsInitOptions & BuildingsAttributes & BuildingsEvents
+
+  const buildingsEvents: AMap.BuildingsEventType[] = layerEvents
+
+  let { instance = $bindable(), ...props }: BuildingsProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(buildingsEvents))
+
+  const buildings = $state.raw<AMap.Buildings>(new AMap.Buildings(snapshot(restProps)))
+
+  $effect(() => {
+    instance = buildings
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    buildings.setMap(map)
+
+    return () => {
+      buildings.destroy()
+      buildings.setMap(null)
+    }
+  })
+
+  useLayerAttributes(() => buildings, restProps)
+
+  $effect(() => {
+    if (restProps.style !== undefined) {
+      buildings.setStyle(snapshot(restProps.style))
+    }
+  })
+
+  createEventListeners<AMap.BuildingsEventType, AMap.Buildings>(
+    () => buildings,
+    () => props,
+    buildingsEvents
+  )
+</script>

package/dist/layer/buildings/buildings.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+type BuildingsEvents = MapEventProps<AMap.BuildingsEventType, AMap.Buildings>;
+type BuildingsInitOptions = AMap.BuildingsOptions & Instance<AMap.Buildings>;
+type BuildingsAttributes = Omit<BuildingsInitOptions, 'map' | 'instance'> & {
+    /**
+     * 建筑物图层样式
+     */
+    style?: AMap.BuildingsStyleOptions;
+};
+export type BuildingsProps = BuildingsInitOptions & BuildingsAttributes & BuildingsEvents;
+declare const Buildings: import("svelte").Component<BuildingsProps, {}, "instance">;
+type Buildings = ReturnType<typeof Buildings>;
+export default Buildings;

package/dist/layer/buildings/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Buildings } from './buildings.svelte';
+export type { BuildingsProps } from './buildings.svelte';

package/dist/layer/buildings/index.js

@@ -0,0 +1 @@
+export { default as Buildings } from './buildings.svelte';

package/dist/layer/canvas-layer/canvas-layer.svelte

@@ -0,0 +1,60 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { layerEvents, useLayerAttributes } from '../layer'
+
+  type CanvasLayerEvents = MapEventProps<AMap.CanvasLayerEventType, AMap.CanvasLayer>
+  type CanvasLayerInitOptions = AMap.CanvasLayerOptions & Instance<AMap.CanvasLayer>
+
+  export type CanvasLayerProps = CanvasLayerInitOptions & CanvasLayerEvents
+
+  const canvasLayerEvents: AMap.CanvasLayerEventType[] = layerEvents
+
+  let { instance = $bindable(), ...props }: CanvasLayerProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(canvasLayerEvents))
+
+  const canvasLayer = $state.raw<AMap.CanvasLayer>(new AMap.CanvasLayer(snapshot(restProps)))
+
+  $effect(() => {
+    instance = canvasLayer
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    canvasLayer.setMap(map)
+
+    return () => {
+      canvasLayer.setMap(null)
+    }
+  })
+
+  useLayerAttributes(() => canvasLayer, restProps)
+
+  $effect(() => {
+    if (!map) return
+    canvasLayer.setBounds(snapshot(restProps.bounds))
+  })
+
+  $effect(() => {
+    if (restProps.canvas !== undefined) {
+      canvasLayer.setCanvas(restProps.canvas)
+    }
+  })
+
+  createEventListeners<AMap.CanvasLayerEventType, AMap.CanvasLayer>(
+    () => canvasLayer,
+    () => props,
+    canvasLayerEvents
+  )
+</script>

package/dist/layer/canvas-layer/canvas-layer.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+type CanvasLayerEvents = MapEventProps<AMap.CanvasLayerEventType, AMap.CanvasLayer>;
+type CanvasLayerInitOptions = AMap.CanvasLayerOptions & Instance<AMap.CanvasLayer>;
+export type CanvasLayerProps = CanvasLayerInitOptions & CanvasLayerEvents;
+declare const CanvasLayer: import("svelte").Component<CanvasLayerProps, {}, "instance">;
+type CanvasLayer = ReturnType<typeof CanvasLayer>;
+export default CanvasLayer;

package/dist/layer/canvas-layer/index.d.ts

@@ -0,0 +1,2 @@
+export { default as CanvasLayer } from './canvas-layer.svelte';
+export type { CanvasLayerProps } from './canvas-layer.svelte';

package/dist/layer/canvas-layer/index.js

@@ -0,0 +1 @@
+export { default as CanvasLayer } from './canvas-layer.svelte';

package/dist/layer/custom-layer/custom-layer.svelte

@@ -0,0 +1,79 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { onDestroy, untrack } from 'svelte'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { layerEvents, useLayerAttributes } from '../layer'
+
+  type CustomLayerEvents = MapEventProps<AMap.CustomLayerEventType, AMap.CustomLayer>
+  interface CustomLayerExtraInitOptions {
+    /**
+     * 画布元素/矢量图形元素
+     */
+    element: HTMLCanvasElement | SVGSVGElement
+  }
+  type CustomLayerInitOptions = AMap.CustomLayerOptions & CustomLayerExtraInitOptions & Instance<AMap.CustomLayer>
+
+  export type CustomLayerProps = CustomLayerInitOptions & CustomLayerEvents
+
+  const customLayerEvents: AMap.CustomLayerEventType[] = layerEvents
+
+  let { instance = $bindable(), element, ...props }: CustomLayerProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(customLayerEvents))
+
+  const customLayer = $state.raw<AMap.CustomLayer>(
+    new AMap.CustomLayer(
+      untrack(() => element),
+      snapshot(restProps)
+    )
+  )
+
+  $effect(() => {
+    instance = customLayer
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    customLayer.setMap(map)
+
+    return () => {
+      customLayer.setMap(null)
+    }
+  })
+
+  useLayerAttributes(() => customLayer, restProps)
+
+  $effect(() => {
+    customLayer.render = restProps.render || customLayer.render
+  })
+
+  $effect(() => {
+    if (restProps.visible !== undefined) {
+      if (restProps.visible) {
+        customLayer.canvas.style.visibility = 'visible'
+        customLayer.canvas.style.display = 'block'
+      } else {
+        customLayer.canvas.style.visibility = 'hidden'
+        customLayer.canvas.style.display = 'none'
+      }
+    }
+  })
+
+  createEventListeners<AMap.CustomLayerEventType, AMap.CustomLayer>(
+    () => customLayer,
+    () => props,
+    customLayerEvents
+  )
+
+  onDestroy(() => customLayer.destroy())
+</script>

package/dist/layer/custom-layer/custom-layer.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+type CustomLayerEvents = MapEventProps<AMap.CustomLayerEventType, AMap.CustomLayer>;
+interface CustomLayerExtraInitOptions {
+    /**
+     * 画布元素/矢量图形元素
+     */
+    element: HTMLCanvasElement | SVGSVGElement;
+}
+type CustomLayerInitOptions = AMap.CustomLayerOptions & CustomLayerExtraInitOptions & Instance<AMap.CustomLayer>;
+export type CustomLayerProps = CustomLayerInitOptions & CustomLayerEvents;
+declare const CustomLayer: import("svelte").Component<CustomLayerProps, {}, "instance">;
+type CustomLayer = ReturnType<typeof CustomLayer>;
+export default CustomLayer;

package/dist/layer/custom-layer/index.d.ts

@@ -0,0 +1,2 @@
+export { default as CustomLayer } from './custom-layer.svelte';
+export type { CustomLayerProps } from './custom-layer.svelte';

package/dist/layer/custom-layer/index.js

@@ -0,0 +1 @@
+export { default as CustomLayer } from './custom-layer.svelte';