import { h, Host } from '@stencil/core';
import classNames from 'classnames';
export class View {
  constructor() {
    this.startTime = 0;
    this.animation = undefined;
    this.hoverClass = undefined;
    this.hoverStartTime = 50;
    this.hoverStayTime = 400;
    this.hover = false;
    this.touch = false;
  }
  onTouchStart() {
    if (this.hoverClass) {
      this.touch = true;
      setTimeout(() => {
        if (this.touch) {
          this.hover = true;
        }
      }, this.hoverStartTime);
    }
    this.timeoutEvent = setTimeout(() => {
      this.onLongPress.emit();
    }, 350);
    this.startTime = Date.now();
  }
  onTouchMove() {
    clearTimeout(this.timeoutEvent);
  }
  onTouchEnd() {
    const spanTime = Date.now() - this.startTime;
    if (spanTime < 350) {
      clearTimeout(this.timeoutEvent);
    }
    if (this.hoverClass) {
      this.touch = false;
      setTimeout(() => {
        if (!this.touch) {
          this.hover = false;
        }
      }, this.hoverStayTime);
    }
  }
  componentDidRender() {
    const el = this.el;
    el.childNodes.forEach(item => {
      // Note: ['s-cn'] Content Reference Node
      if (item.nodeType === document.COMMENT_NODE && item['s-cn'])
        item['s-cn'] = false;
      // Note: ['s-sr'] Is a slot reference node (渲染完成后禁用 slotRelocation 特性, 避免 Stencil 组件相互调用时内置排序与第三方 UI 框架冲突导致组件顺序混乱)
      if (item.nodeType !== document.COMMENT_NODE && item['s-sr'])
        item['s-sr'] = false;
    });
  }
  render() {
    const cls = classNames({
      [`${this.hoverClass}`]: this.hover
    });
    let attr = {};
    if (!!this.animation) {
      attr['animation'] = this.animation;
      attr['data-animation'] = this.animation;
    }
    return (h(Host, Object.assign({ class: cls }, attr), h("slot", null)));
  }
  static get is() { return "taro-view-core"; }
  static get originalStyleUrls() {
    return {
      "$": ["./style/index.scss"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["./style/index.css"]
    };
  }
  static get properties() {
    return {
      "animation": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "animation",
        "reflect": false
      },
      "hoverClass": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "hover-class",
        "reflect": false
      },
      "hoverStartTime": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "hover-start-time",
        "reflect": false,
        "defaultValue": "50"
      },
      "hoverStayTime": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "hover-stay-time",
        "reflect": false,
        "defaultValue": "400"
      }
    };
  }
  static get states() {
    return {
      "hover": {},
      "touch": {}
    };
  }
  static get events() {
    return [{
        "method": "onLongPress",
        "name": "longpress",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": ""
        },
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        }
      }];
  }
  static get elementRef() { return "el"; }
  static get listeners() {
    return [{
        "name": "touchstart",
        "method": "onTouchStart",
        "target": undefined,
        "capture": false,
        "passive": true
      }, {
        "name": "touchmove",
        "method": "onTouchMove",
        "target": undefined,
        "capture": false,
        "passive": true
      }, {
        "name": "touchend",
        "method": "onTouchEnd",
        "target": undefined,
        "capture": false,
        "passive": true
      }];
  }
}
//# sourceMappingURL=view.js.map
