<template>
  <kk-button text @click="open">Click to open Message Box</kk-button>
</template>

<script lang="ts" setup>
import { KkButton, KkMessage, KkMessageBox } from 'kankan-components'
const open = () => {
  KkMessageBox.prompt('Please input your e-mail', 'Tip', {
    confirmButtonText: 'OK',
    cancelButtonText: 'Cancel',
    inputPattern:
      /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
    inputErrorMessage: 'Invalid Email',
  })
    .then(({ value }) => {
      KkMessage({
        type: 'success',
        message: `Your email is:${value}`,
      })
    })
    .catch(() => {
      KkMessage({
        type: 'info',
        message: 'Input canceled',
      })
    })
}
</script>
