Unverified Commit fc0f5371 authored by Nicolò Maria Mezzopera's avatar Nicolò Maria Mezzopera
Browse files

feat: import composition function in hierarchy

parent 40e22c85

src/App.vue

+5 −1
Original line number Diff line number Diff line
@@ -3,7 +3,11 @@ 
    <l-map :zoom="3" :center="[47.41322, -1.219482]" @move="log('move')">

      <l-tile-layer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png">

      </l-tile-layer>

      <l-marker :lat-lng="[0, 0]" draggable></l-marker>

      <l-marker

        :lat-lng="[0, 0]"

        draggable

        @moveend="log('moveend')"

      ></l-marker>

    </l-map>

  </div>

</template>

src/components/LMarker.vue

+3 −4
Original line number Diff line number Diff line 
<script>

/* eslint-disable */

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



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

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

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



/**
@@ -58,7 +57,7 @@ export default { 
      const methods = {

        setDraggable(value) {

          if (mapRef.value.dragging) {

            newVal

            value

              ? mapRef.value.dragging.enable()

              : mapRef.value.dragging.disable();

          }
@@ -74,7 +73,7 @@ export default { 


          if (mapRef.value) {

            const oldLatLng = mapRef.value.getLatLng();

            const newLatLng = latlng(newVal);

            const newLatLng = latLng(newVal);

            if (

              newLatLng.lat !== oldLatLng.lat ||

              newLatLng.lng !== oldLatLng.lng

src/components/LTileLayer.vue

+1 −34
Original line number Diff line number Diff line 
<script>

/* eslint-disable */

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

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

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

import {

  props as gridLayerProps,

  setup as gridLayerSetup,

} from "../functions/gridLayer";

import {

  props as tileLayerProps,

  setup as tileLayerSetup,
@@ -14,8 +8,6 @@ import { 


export default {

  props: {

    ...layerProps,

    ...gridLayerProps,

    ...tileLayerProps,

    url: {

      type: String,
@@ -26,32 +18,7 @@ export default { 
    const mapRef = ref({});

    const addLayer = inject("addLayer");



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

      props,

      mapRef

    );



    const {

      options: gridLayerOptions,

      methods: gridLayerMethods,

    } = gridLayerSetup(props);



    const {

      options: tileLayerOptions,

      methods: tileLayerMethods,

    } = tileLayerSetup(props);



    const options = {

      ...layerOptions,

      ...gridLayerOptions,

      ...tileLayerOptions,

    };



    const methods = {

      ...layerMethods,

      ...gridLayerMethods,

      ...tileLayerMethods,

    };

    const { options, methods } = tileLayerSetup(props, mapRef);



    onMounted(async () => {

      const { tileLayer, DomEvent } = await import(

src/functions/gridLayer.js

+10 −2
Original line number Diff line number Diff line 
import { props as layerProps, setup as layerSetup } from "./layer";



export const props = {

  ...layerProps,

  pane: {

    type: String,

    default: "tilePane",
@@ -22,13 +25,18 @@ export const props = { 
  },

};



export const setup = (props) => {

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

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

    props,

    mapRef

  );

  const options = {

    ...layerOptions,

    pane: props.pane,

    opacity: props.opacity,

    zIndex: props.zIndex,

    tileSize: props.tileSize,

    noWrap: props.noWrap,

  };

  return options;

  return { options, methods: { ...layerMethods } };

};

src/functions/tileLayer.js

+15 −2
Original line number Diff line number Diff line 
import { props as gridLayerProps, setup as gridLayerSetup } from "./gridLayer";



export const props = {

  ...gridLayerProps,

  tms: {

    type: Boolean,

    default: false,
@@ -13,11 +16,21 @@ export const props = { 
  },

};



export const setup = (props) => {

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

  const {

    options: gridLayerOptions,

    methods: gridLayerMethods,

  } = gridLayerSetup(props, mapRef);

  const options = {

    ...gridLayerOptions,

    tms: props.tms,

    subdomains: props.subdomains,

    detectRetina: props.detectRetina,

  };

  return options;

  return {

    options,

    methods: {

      ...gridLayerMethods,

    },

  };

};