<!-- eslint-disable vue/no-mutating-props -->
<script setup lang="ts">
defineOptions({ name: 'MjFormInput' })

const props = withDefaults(
  defineProps<{
    autoComplete?: string
    clearable?: boolean
    disabled?: boolean
    modelValue: any
    placeholder?: any
  }>(),
  {
    placeholder: undefined,
    disabled: false,
    clearable: true,
    autoComplete: 'new-password',
  },
)

const emit = defineEmits(['update:modelValue'])

const text = computed({
  get: () => props.modelValue,
  set: (val) => {
    emit('update:modelValue', val)
  },
})
</script>

<template>
  <vxe-input
    :disabled="disabled"
    v-model="text"
    :placeholder="placeholder"
    :clearable="clearable"
    :auto-complete="autoComplete"
  />
</template>

<style lang="scss" scoped></style>
