feat: add LLayerGroup

<script>

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

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

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

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

export default {

  props,

  setup(props, context) {

    const leafletRef = ref({});

    const ready = ref(false);

    const addLayer = inject("addLayer");

    const { methods } = layerGroup(props, leafletRef);

    onMounted(async () => {

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

        "leaflet/dist/leaflet-src.esm"

      );

      leafletRef.value = layerGroup();

      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>

import { provide } from "vue";

import { props as layerProps, setup as layerSetup } from "./layer";

export const props = {

  ...layerProps,

};

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

  const { options: layerOptions, methods: layerMethods } = layerSetup(

    props,

    leafletRef

  );

  const options = {

    ...layerOptions,

  };

  const methods = {

    ...layerMethods,

    addLayer(layer) {

      leafletRef.value.addLayer(layer.leafletObject);

    },

    removeLayer(layer) {

      leafletRef.value.removeLayer(layer.leafletObject);

    },

  };

  provide("addLayer", methods.addLayer);

  provide("removeLayer", methods.removeLayer);

  return { options, methods };

};