Add LCircle control for geographic circular regions

<script>

import { onMounted, ref, inject } from "vue";

import { remapEvents, propsBinder } from "../utils.js";

import { props, setup as circleSetup } from "../functions/circle";

import { render } from "../functions/layer";

/**

 * Circle component, lets you add and personalize circles on the map

 */

export default {

  name: "LCircle",

  props,

  setup(props, context) {

    const leafletRef = ref({});

    const ready = ref(false);

    const addLayer = inject("addLayer");

    const { options, methods } = circleSetup(props, leafletRef, context);

    onMounted(async () => {

      const { circle, DomEvent, setOptions } = await import(

        "leaflet/dist/leaflet-src.esm"

      );

      leafletRef.value = circle(props.latLng, options);

      const listeners = remapEvents(context.attrs);

      DomEvent.on(leafletRef.value, listeners);

      propsBinder(methods, leafletRef.value, props, setOptions);

      addLayer({

        ...props,

        ...methods,

        leafletObject: leafletRef.value,

      });

      ready.value = true;

    });

    return render(ready, context);

  },

};

</script>

export { default as LCircle } from "./LCircle.vue";

export { default as LCircleMarker } from "./LCircleMarker.vue";

export { default as LControlAttribution } from "./LControlAttribution.vue";

export { default as LControlLayers } from "./LControlLayers.vue";

import {

  props as circleMarkerProps,

  setup as circleMarkerSetup,

} from "./circleMarker";

export const props = {

  ...circleMarkerProps,

  /**

   * Radius of the circle in meters.

   */

  radius: {

    type: Number,

    default: null,

  },

};

export const setup = (props, leafletRef, context) => {

  const {

    options: circleMarkerOptions,

    methods: circleMarkerMethods,

  } = circleMarkerSetup(props, leafletRef, context);

  const options = {

    ...circleMarkerOptions,

    ...props,

  };

  const methods = {

    ...circleMarkerMethods,

  };

  return { options, methods };

};