Commit 6b0c8de1 authored by Michael Underwood's avatar Michael Underwood
Browse files

feat: Refactor optionsMerger to base component setup

parent fa8dae80

src/components/LIcon.vue

+20 −8
Original line number Diff line number Diff line
@@ -2,7 +2,10 @@ 
import { onMounted, ref, inject, nextTick, h } from "vue";

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

import { props as iconProps } from "../functions/icon";

import { props as componentProps, optionsMerger } from "../functions/component";

import {

  props as componentProps,

  setup as componentSetup,

} from "../functions/component";



/**

 * Icon component, lets you add and custom icons to the map
@@ -40,16 +43,25 @@ export default { 
        offDomEvent(iconObject, listeners);

      }



      const { options: componentOptions } = componentSetup(props);

      const options = {

        ...props,

        ...componentOptions,

        iconUrl: props.iconUrl,

        iconRetinaUrl: props.iconRetinaUrl,

        iconSize: props.iconSize,

        iconAnchor: props.iconAnchor,

        popupAnchor: props.popupAnchor,

        tooltipAnchor: props.tooltipAnchor,

        shadowUrl: props.shadowUrl,

        shadowRetinaUrl: props.shadowRetinaUrl,

        shadowSize: props.shadowSize,

        shadowAnchor: props.shadowAnchor,

        bgPos: props.bgPos,

        className: props.className,

        html: elHtml || props.html,

      };



      if (elHtml) {

        options.html = elHtml;

      }



      const mergedOptions = optionsMerger(options, props);

      iconObject = options.html ? divIcon(mergedOptions) : icon(mergedOptions);

      iconObject = options.html ? divIcon(options) : icon(options);

      onDomEvent(iconObject, listeners);

      setIcon(iconObject);

    };

src/components/LMap.vue

+24 −23
Original line number Diff line number Diff line
@@ -16,7 +16,10 @@ import { 
  provideLeafletWrapper,

  updateLeafletWrapper,

} from "../utils.js";

import { props as componentProps, optionsMerger } from "../functions/component";

import {

  props as componentProps,

  setup as componentSetup,

} from "../functions/component";



export default {

  props: {
@@ -147,9 +150,9 @@ export default { 
      layersToAdd: [],

      layersInControl: [],

    });



    const options = optionsMerger(

      {

    const { options: componentOptions } = componentSetup(props);

    const options = {

      ...componentOptions,

      minZoom: props.minZoom,

      maxZoom: props.maxZoom,

      maxBounds: props.maxBounds,
@@ -166,9 +169,7 @@ export default { 
      zoomAnimationThreshold: props.zoomAnimationThreshold,

      fadeAnimation: props.fadeAnimation,

      markerZoomAnimation: props.markerZoomAnimation,

      },

      props

    );

    };



    const addLayer = provideLeafletWrapper("addLayer");

    const removeLayer = provideLeafletWrapper("removeLayer");

src/functions/component.js

+2 −2
Original line number Diff line number Diff line
@@ -5,6 +5,6 @@ export const props = { 
  },

};



export const optionsMerger = (options, props) => {

  return { ...options, ...props.options, options: undefined };

export const setup = (props) => {

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

};

src/functions/control.js

+10 −7
Original line number Diff line number Diff line 
import { onUnmounted, h } from "vue";

import { props as componentProps, optionsMerger } from "./component";

import { props as componentProps, setup as componentSetup } from "./component";



export const props = {

  ...componentProps,
@@ -10,14 +10,17 @@ export const props = { 
};



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

  const options = optionsMerger(

    {

  const {

    options: componentOptions,

    methods: componentMethods,

  } = componentSetup(props);

  const options = {

    ...componentOptions,

    position: props.position,

    },

    props

  );

  };



  const methods = {

    ...componentMethods,

    setPosition(position) {

      if (leafletRef.value) {

        leafletRef.value.setPosition(position);

src/functions/interactiveLayer.js

+7 −10
Original line number Diff line number Diff line 
import { props as componentProps, optionsMerger } from "./component";

import { props as componentProps, setup as componentSetup } from "./component";



export const props = {

  ...componentProps,
@@ -13,15 +13,12 @@ export const props = { 
};



export const setup = (props) => {

  const options = optionsMerger(

    {

  const { options: componentOptions, methods } = componentSetup(props);

  const options = {

    ...componentOptions,

    interactive: props.interactive,

    bubblingMouseEvents: props.bubblingMouseEvents,

    },

    props

  );



  const methods = {};

  };



  return { options, methods };

};