@antv/l7-component 2.25.6 → 2.25.7

package/es/control/baseControl/control.js

@@ -1,256 +0,0 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { PositionType } from '@antv/l7-core';
-import { DOM } from '@antv/l7-utils';
-import EventEmitter from 'eventemitter3';
-export { PositionType } from '@antv/l7-core';
-export { Control };
-export default class Control extends EventEmitter {
-  constructor(option) {
-    super();
-    /**
-     * 当前控件实例配置
-     */
-    _defineProperty(this, "controlOption", void 0);
-    /**
-     * 控件的 DOM 容器
-     * @protected
-     */
-    _defineProperty(this, "container", void 0);
-    /**
-     * 当前控件是否显示
-     * @protected
-     */
-    _defineProperty(this, "isShow", void 0);
-    _defineProperty(this, "sceneContainer", void 0);
-    _defineProperty(this, "scene", void 0);
-    _defineProperty(this, "mapsService", void 0);
-    _defineProperty(this, "renderService", void 0);
-    _defineProperty(this, "layerService", void 0);
-    _defineProperty(this, "controlService", void 0);
-    _defineProperty(this, "configService", void 0);
-    Control.controlCount++;
-    this.controlOption = _objectSpread(_objectSpread({}, this.getDefault(option)), option || {});
-  }
-  getOptions() {
-    return this.controlOption;
-  }
-
-  /**
-   * 更新配置的方法，子类如果有自己的配置，也需要重写该方法
-   * @param newOptions
-   */
-  setOptions(newOptions) {
-    const defaultOptions = this.getDefault(newOptions);
-    Object.entries(newOptions).forEach(([key, value]) => {
-      if (value === undefined) {
-        newOptions[key] = defaultOptions[key];
-      }
-    });
-    if ('position' in newOptions) {
-      this.setPosition(newOptions.position);
-    }
-    if ('className' in newOptions) {
-      this.setClassName(newOptions.className);
-    }
-    if ('style' in newOptions) {
-      this.setStyle(newOptions.style);
-    }
-    this.controlOption = _objectSpread(_objectSpread({}, this.controlOption), newOptions);
-  }
-
-  /**
-   * 当 Control 被添加至 Scene 中，被 controlService 调用的方法
-   * @param sceneContainer
-   */
-  addTo(sceneContainer) {
-    // 初始化各个 Service 实例
-    this.mapsService = sceneContainer.mapService;
-    this.renderService = sceneContainer.rendererService;
-    this.layerService = sceneContainer.layerService;
-    this.controlService = sceneContainer.controlService;
-    this.configService = sceneContainer.globalConfigService;
-    this.scene = sceneContainer.sceneService;
-    this.sceneContainer = sceneContainer;
-    this.isShow = true;
-
-    // 初始化 container
-    this.container = this.onAdd();
-    DOM.addClass(this.container, 'l7-control');
-    const {
-      className,
-      style
-    } = this.controlOption;
-    if (className) {
-      this.setClassName(className);
-    }
-    if (style) {
-      this.setStyle(style);
-    }
-    // 将 container 插入容器中
-    this.insertContainer();
-    this.emit('add', this);
-    return this;
-  }
-
-  /**
-   * 将控件移除时触发
-   */
-  remove() {
-    if (!this.mapsService) {
-      return this;
-    }
-    DOM.remove(this.container);
-    this.onRemove();
-    this.emit('remove', this);
-  }
-
-  /**
-   * Control 被添加的时候被调用，返回 Control 对应的 DOM 容器
-   */
-  onAdd() {
-    return DOM.create('div');
-  }
-
-  /**
-   * Control 被移除时调用
-   */
-  // tslint:disable-next-line:no-empty
-  onRemove() {}
-
-  /**
-   * 显示控件时触发
-   */
-  show() {
-    const container = this.container;
-    DOM.removeClass(container, 'l7-control--hide');
-    this.isShow = true;
-    this.emit('show', this);
-  }
-
-  /**
-   * 隐藏控件时触发
-   */
-  hide() {
-    const container = this.container;
-    DOM.addClass(container, 'l7-control--hide');
-    this.isShow = false;
-    this.emit('hide', this);
-  }
-
-  /**
-   * 获取默认构造器参数
-   */
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  getDefault(option) {
-    // tslint:disable-next-line:no-object-literal-type-assertion
-    return {
-      position: PositionType.TOPRIGHT,
-      name: `${Control.controlCount}`
-    };
-  }
-
-  /**
-   * 获取当前控件对应的 DOM 容器
-   */
-  getContainer() {
-    return this.container;
-  }
-
-  /**
-   * 获取当前 Control 是否展示
-   */
-  getIsShow() {
-    return this.isShow;
-  }
-  _refocusOnMap(e) {
-    // if map exists and event is not a keyboard event
-    if (this.mapsService && e && e.screenX > 0 && e.screenY > 0) {
-      const container = this.mapsService.getContainer();
-      if (container !== null) {
-        container.focus();
-      }
-    }
-  }
-
-  /**
-   * 设置当前控件位置
-   * @param position
-   */
-  setPosition(position = PositionType.TOPLEFT) {
-    // 考虑组件的自动布局，需要销毁重建
-    const controlService = this.controlService;
-    if (controlService) {
-      controlService.removeControl(this);
-    }
-    this.controlOption.position = position;
-    if (controlService) {
-      controlService.addControl(this, this.sceneContainer);
-    }
-    return this;
-  }
-
-  /**
-   * 设置容器 container 的样式相关位置，包含 className
-   * @param className
-   */
-  setClassName(className) {
-    const container = this.container;
-    const {
-      className: oldClassName
-    } = this.controlOption;
-    if (oldClassName) {
-      DOM.removeClass(container, oldClassName);
-    }
-    if (className) {
-      DOM.addClass(container, className);
-    }
-  }
-
-  /**
-   * 设置容器 container 的样式相关位置，包含 style
-   * @param style
-   */
-  setStyle(style) {
-    const container = this.container;
-    if (style) {
-      container.setAttribute('style', style);
-    } else {
-      container.removeAttribute('style');
-    }
-  }
-
-  /**
-   * 将控件 DOM 插入到对应 position 的容器中
-   * @protected
-   */
-  insertContainer() {
-    const position = this.controlOption.position;
-    const container = this.container;
-    if (position instanceof Element) {
-      position.appendChild(container);
-    } else {
-      const corner = this.controlService.controlCorners[position];
-      if (['bottomleft', 'bottomright', 'righttop', 'rightbottom'].includes(position)) {
-        corner.insertBefore(container, corner.firstChild);
-      } else {
-        corner.appendChild(container);
-      }
-    }
-  }
-
-  /**
-   * 检查当前传入 option 是否包含 keys 字段
-   * @param option
-   * @param keys
-   * @protected
-   */
-  checkUpdateOption(option, keys) {
-    return keys.some(key => key in option);
-  }
-}
-/**
- * 当前类型控件实例个数
- * @protected
- */
-_defineProperty(Control, "controlCount", 0);

package/es/control/baseControl/index.d.ts

@@ -1,4 +0,0 @@
-export { ButtonControl, type IButtonControlOption } from './buttonControl';
-export { Control, PositionType, type IControlOption } from './control';
-export { PopperControl, type IPopperControlOption } from './popperControl';
-export { SelectControl, type ControlOptionItem, type ISelectControlOption } from './selectControl';

package/es/control/baseControl/index.js

@@ -1,4 +0,0 @@
-export { ButtonControl } from "./buttonControl";
-export { Control, PositionType } from "./control";
-export { PopperControl } from "./popperControl";
-export { SelectControl } from "./selectControl";

package/es/control/baseControl/popperControl.d.ts

@@ -1,28 +0,0 @@
-import type { PopperPlacement, PopperTrigger } from '../../utils/popper';
-import { Popper } from '../../utils/popper';
-import type { IButtonControlOption } from './buttonControl';
-import ButtonControl from './buttonControl';
-export { PopperControl };
-export interface IPopperControlOption extends IButtonControlOption {
-    popperPlacement: PopperPlacement;
-    popperClassName?: string;
-    popperTrigger: PopperTrigger;
-}
-export default class PopperControl<O extends IPopperControlOption = IPopperControlOption> extends ButtonControl<O> {
-    /**
-     * 气泡实例
-     * @protected
-     */
-    protected popper: Popper;
-    getPopper(): Popper;
-    hide(): void;
-    /**
-     * 获取默认配置
-     * @param option
-     */
-    getDefault(option?: Partial<O>): O;
-    onAdd(): HTMLElement;
-    onRemove(): void;
-    initPopper(): Popper;
-    setOptions(option: Partial<O>): void;
-}

package/es/control/baseControl/popperControl.js

@@ -1,92 +0,0 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { Popper } from "../../utils/popper";
-import ButtonControl from "./buttonControl";
-export { PopperControl };
-const PopperPlacementMap = {
-  topleft: 'right-start',
-  topcenter: 'bottom',
-  topright: 'left-start',
-  bottomleft: 'right-end',
-  bottomcenter: 'top',
-  bottomright: 'left-end',
-  lefttop: 'bottom-start',
-  leftcenter: 'right',
-  leftbottom: 'top-start',
-  righttop: 'bottom-end',
-  rightcenter: 'left',
-  rightbottom: 'top-end'
-};
-export default class PopperControl extends ButtonControl {
-  constructor(...args) {
-    super(...args);
-    /**
-     * 气泡实例
-     * @protected
-     */
-    _defineProperty(this, "popper", void 0);
-  }
-  getPopper() {
-    return this.popper;
-  }
-  hide() {
-    this.popper.hide();
-    super.hide();
-  }
-
-  /**
-   * 获取默认配置
-   * @param option
-   */
-  getDefault(option) {
-    var _option$position;
-    const defaultOption = super.getDefault(option);
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const position = (_option$position = option === null || option === void 0 ? void 0 : option.position) !== null && _option$position !== void 0 ? _option$position : defaultOption.position;
-    return _objectSpread(_objectSpread({}, super.getDefault(option)), {}, {
-      popperPlacement: position instanceof Element ? 'bottom' : PopperPlacementMap[position],
-      popperTrigger: 'click'
-    });
-  }
-  onAdd() {
-    const button = super.onAdd();
-    this.initPopper();
-    return button;
-  }
-  onRemove() {
-    this.popper.destroy();
-  }
-  initPopper() {
-    const {
-      popperClassName,
-      popperPlacement,
-      popperTrigger
-    } = this.controlOption;
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const popperContainer = this.mapsService.getMapContainer();
-
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    this.popper = new Popper(this.button, {
-      className: popperClassName,
-      placement: popperPlacement,
-      trigger: popperTrigger,
-      container: popperContainer,
-      unique: true
-    });
-    this.popper.on('show', () => {
-      this.emit('popperShow', this);
-    }).on('hide', () => {
-      this.emit('popperHide', this);
-    });
-    return this.popper;
-  }
-  setOptions(option) {
-    super.setOptions(option);
-    if (this.checkUpdateOption(option, ['popperPlacement', 'popperTrigger', 'popperClassName'])) {
-      const content = this.popper.getContent();
-      this.popper.destroy();
-      this.initPopper();
-      this.popper.setContent(content);
-    }
-  }
-}

package/es/control/baseControl/selectControl.d.ts

@@ -1,53 +0,0 @@
-import type { IPopperControlOption } from './popperControl';
-import { PopperControl } from './popperControl';
-type BaseOptionItem = {
-    value: string;
-    text: string;
-    [key: string]: string;
-};
-type NormalOptionItem = BaseOptionItem & {
-    icon?: HTMLElement;
-};
-type ImageOptionItem = BaseOptionItem & {
-    img: string;
-};
-export type ControlOptionItem = ImageOptionItem | NormalOptionItem;
-export interface ISelectControlOption extends IPopperControlOption {
-    options: ControlOptionItem[];
-    defaultValue?: string | string[];
-}
-export { SelectControl };
-export default class SelectControl<O extends ISelectControlOption = ISelectControlOption> extends PopperControl<O> {
-    /**
-     * 当前选中的值
-     * @protected
-     */
-    protected selectValue: string[];
-    /**
-     * 选项对应的 DOM 列表
-     * @protected
-     */
-    protected optionDOMList: HTMLElement[];
-    setOptions(option: Partial<O>): void;
-    onAdd(): HTMLElement;
-    getSelectValue(): string | string[];
-    setSelectValue(value: string | string[], emitEvent?: boolean): void;
-    /**
-     * 是否为多选
-     * @protected
-     */
-    protected getIsMultiple(): boolean;
-    /**
-     * 渲染弹窗内容
-     * @param options
-     * @returns
-     */
-    protected getPopperContent(options: ControlOptionItem[]): HTMLElement;
-    protected createNormalOption: (option: NormalOptionItem) => HTMLElement;
-    protected createImageOption(option: ImageOptionItem): HTMLElement;
-    protected createCheckbox(isSelect: boolean): HTMLElement;
-    protected createRadio(isSelect: boolean): HTMLElement;
-    protected onItemClick: (item: ControlOptionItem) => void;
-    protected isImageOptions(): boolean;
-    protected transSelectValue(value: string | string[]): string[];
-}

package/es/control/baseControl/selectControl.js

@@ -1,173 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { DOM } from '@antv/l7-utils';
-import { PopperControl } from "./popperControl";
-export { SelectControl };
-var SelectControlConstant = /*#__PURE__*/function (SelectControlConstant) {
-  SelectControlConstant["ActiveOptionClassName"] = "l7-select-control-item-active";
-  SelectControlConstant["OptionValueAttrKey"] = "data-option-value";
-  SelectControlConstant["OptionIndexAttrKey"] = "data-option-index";
-  return SelectControlConstant;
-}(SelectControlConstant || {});
-export default class SelectControl extends PopperControl {
-  constructor(...args) {
-    super(...args);
-    /**
-     * 当前选中的值
-     * @protected
-     */
-    _defineProperty(this, "selectValue", []);
-    /**
-     * 选项对应的 DOM 列表
-     * @protected
-     */
-    _defineProperty(this, "optionDOMList", void 0);
-    _defineProperty(this, "createNormalOption", option => {
-      const isSelect = this.selectValue.includes(option.value);
-      const optionDOM = DOM.create('div', `l7-select-control-item ${isSelect ? SelectControlConstant.ActiveOptionClassName : ''}`);
-      if (this.getIsMultiple()) {
-        optionDOM.appendChild(this.createCheckbox(isSelect));
-      } else {
-        optionDOM.appendChild(this.createRadio(isSelect));
-      }
-      if (option.icon) {
-        optionDOM.appendChild(option.icon);
-      }
-      const textDOM = DOM.create('span');
-      textDOM.innerText = option.text;
-      optionDOM.appendChild(textDOM);
-      return optionDOM;
-    });
-    _defineProperty(this, "onItemClick", item => {
-      if (this.getIsMultiple()) {
-        const targetIndex = this.selectValue.findIndex(value => value === item.value);
-        if (targetIndex > -1) {
-          this.selectValue.splice(targetIndex, 1);
-        } else {
-          this.selectValue = [...this.selectValue, item.value];
-        }
-      } else {
-        this.selectValue = [item.value];
-      }
-      this.setSelectValue(this.selectValue);
-    });
-  }
-  setOptions(option) {
-    super.setOptions(option);
-    const {
-      options
-    } = option;
-    if (options) {
-      this.popper.setContent(this.getPopperContent(options));
-    }
-  }
-  onAdd() {
-    const button = super.onAdd();
-    const {
-      defaultValue
-    } = this.controlOption;
-    if (defaultValue) {
-      this.selectValue = this.transSelectValue(defaultValue);
-    }
-    this.popper.setContent(this.getPopperContent(this.controlOption.options));
-    return button;
-  }
-  getSelectValue() {
-    return this.getIsMultiple() ? this.selectValue : this.selectValue[0];
-  }
-  setSelectValue(value, emitEvent = true) {
-    const finalValue = this.transSelectValue(value);
-    this.optionDOMList.forEach(optionDOM => {
-      const optionValue = optionDOM.getAttribute(SelectControlConstant.OptionValueAttrKey);
-      const checkboxDOM = optionDOM.querySelector('input[type=checkbox]');
-      const radioDOM = optionDOM.querySelector('input[type=radio]');
-      const isActive = finalValue.includes(optionValue);
-
-      // 设置类名和选中状态的函数
-      const setDOMState = (dom, active) => {
-        DOM.toggleClass(optionDOM, SelectControlConstant.ActiveOptionClassName, active);
-        if (dom) {
-          DOM.setChecked(dom, active);
-        }
-      };
-      setDOMState(checkboxDOM, isActive);
-      setDOMState(radioDOM, isActive);
-    });
-    this.selectValue = finalValue;
-    if (emitEvent) {
-      this.emit('selectChange', this.getIsMultiple() ? finalValue : finalValue[0]);
-    }
-  }
-
-  /**
-   * 是否为多选
-   * @protected
-   */
-  getIsMultiple() {
-    return false;
-  }
-
-  /**
-   * 渲染弹窗内容
-   * @param options
-   * @returns
-   */
-  getPopperContent(options) {
-    const isImageOptions = this.isImageOptions();
-    const content = DOM.create('div', isImageOptions ? 'l7-select-control--image' : 'l7-select-control--normal');
-    if (this.getIsMultiple()) {
-      DOM.addClass(content, 'l7-select-control--multiple');
-    }
-    const optionsDOMList = options.map((option, optionIndex) => {
-      const optionDOM = isImageOptions ?
-      // @ts-ignore
-      this.createImageOption(option) : this.createNormalOption(option);
-      optionDOM.setAttribute(SelectControlConstant.OptionValueAttrKey, option.value);
-      optionDOM.setAttribute(SelectControlConstant.OptionIndexAttrKey, window.String(optionIndex));
-      optionDOM.addEventListener('click', this.onItemClick.bind(this, option));
-      return optionDOM;
-    });
-    content.append(...optionsDOMList);
-    this.optionDOMList = optionsDOMList;
-    return content;
-  }
-  createImageOption(option) {
-    const isSelect = this.selectValue.includes(option.value);
-    const optionDOM = DOM.create('div', `l7-select-control-item ${isSelect ? SelectControlConstant.ActiveOptionClassName : ''}`);
-    const imgDOM = DOM.create('img');
-    imgDOM.setAttribute('src', option.img);
-    DOM.setUnDraggable(imgDOM);
-    optionDOM.appendChild(imgDOM);
-    const rowDOM = DOM.create('div', 'l7-select-control-item-row');
-    if (this.getIsMultiple()) {
-      optionDOM.appendChild(this.createCheckbox(isSelect));
-    }
-    const textDOM = DOM.create('span');
-    textDOM.innerText = option.text;
-    rowDOM.appendChild(textDOM);
-    optionDOM.appendChild(rowDOM);
-    return optionDOM;
-  }
-  createCheckbox(isSelect) {
-    const checkboxDOM = DOM.create('input');
-    checkboxDOM.setAttribute('type', 'checkbox');
-    if (isSelect) {
-      DOM.setChecked(checkboxDOM, true);
-    }
-    return checkboxDOM;
-  }
-  createRadio(isSelect) {
-    const radioDOM = DOM.create('input');
-    radioDOM.setAttribute('type', 'radio');
-    if (isSelect) {
-      DOM.setChecked(radioDOM, true);
-    }
-    return radioDOM;
-  }
-  isImageOptions() {
-    // @ts-ignore
-    return !!this.controlOption.options.find(item => item.img);
-  }
-  transSelectValue(value) {
-    return Array.isArray(value) ? value : [value];
-  }
-}

package/es/control/exportImage.d.ts

@@ -1,19 +0,0 @@
-import type { IButtonControlOption } from './baseControl/buttonControl';
-import ButtonControl from './baseControl/buttonControl';
-export interface IExportImageControlOption extends IButtonControlOption {
-    imageType: 'png' | 'jpeg';
-    onExport: (base64: string) => void;
-}
-export { ExportImage };
-export default class ExportImage extends ButtonControl<IExportImageControlOption> {
-    onAdd(): HTMLElement;
-    getDefault(option?: Partial<IExportImageControlOption>): IExportImageControlOption;
-    getImage(): Promise<string>;
-    protected onClick: () => Promise<void>;
-    /**
-     * 将多张图片合并为一张图片
-     * @protected
-     * @param base64List
-     */
-    protected mergeImage: (...base64List: string[]) => Promise<string>;
-}