import TyComponent from '../common/component'

TyComponent({
  /**
   * 组件的属性列表
   */
  properties: {
    name: {
      type: String
    },
    label: {
      type: String
    },
    size: {
      type: String
    },
    value: {
      type: [String, Number]
    },
    type: {
      type: String,
      value: 'text'
    },
    fixed: {
      type: Boolean,
      value: false
    },
    focus: {
      type: Boolean,
      value: false
    },
    border: {
      type: Boolean,
      value: true
    },
    disabled: {
      type: Boolean,
      value: false
    },
    readonly: {
      type: Boolean,
      value: false
    },
    clearable: {
      type: Boolean,
      value: false
    },
    clickable: {
      type: Boolean,
      value: false
    },
    required: {
      type: Boolean,
      value: false
    },
    password: {
      type: Boolean,
      value: false
    },
    titleWidth: {
      type: String,
      value: '90px'
    },
    maxlength: {
      type: Number,
      value: -1
    },
    placeholder: {
      type: String
    },
    placeholderStyle: {
      type: String
    },
    customStyle: {
      type: String
    },
    isLink: {
      type: Boolean,
      value: false
    },
    arrowDirection: {
      type: String
    },
    error: {
      type: Boolean,
      value: false
    },
    errorMessage: {
      type: String
    },
    errorMessageAlign: {
      type: String
    },
    inputAlign: {
      type: String,
      value: 'left'
    },
    autosize: {
      type: Boolean,
      value: false
    },
    leftIcon: {
      type: String
    },
    rightIcon: {
      type: String
    },
    confirmType: {
      type: String,
      value: 'done'
    },
    confirmHold: {
      type: Boolean,
      value: false
    },
    holdKeyboard: {
      type: Boolean,
      value: false
    },
    cursorSpacing: {
      type: Number,
      value: 50
    },
    adjustPosition: {
      type: Boolean,
      value: true
    },
    showConfirmBar: {
      type: Boolean,
      value: true
    },
    selectionStart: {
      type: Number,
      value: -1
    },
    selectionEnd: {
      type: Number,
      value: -1
    },
    inputClass: {
      type: String
    },
    rightIconClass: {
      type: String
    }

  },

  /**
   * 组件的初始数据
   */
  data: {
    value: ''
  },

  /**
   * 组件的方法列表
   */
  methods: {
    handleInput({detail}) {
      const value = detail || ''
      this.setData({value})
      this.triggerEvent('input', detail)
    },
    handleChange({detail}) {
      const value = detail || ''
      this.setData({value})
      this.triggerEvent('change', detail)
    },
    handleConfirm({detail}) {
      this.triggerEvent('confirm', detail)
    },
    handleClickIcon({detail}) {
      this.triggerEvent('click-icon', detail)
    },
    handleFocus({detail}) {
      this.triggerEvent('focus', detail)
    },
    handleBlur({detail}) {
      this.triggerEvent('blur', detail)
    },
    handleClear({detail}) {
      this.triggerEvent('clear', detail)
    },
  }
})
