Commit de1cd9c9 authored by GuiΩ's avatar GuiΩ
Browse files

feat(Modal): add closeOnBlur option

parent 5145937e
......@@ -58,7 +58,8 @@ import Modal from "@/components/Modal.vue";
<template lang="pug">
Modal(
ref="modal"
@resize="onResize")
@resize="onResize"
:closeOnBlur="true")
template(v-slot:title) {{ state.title }}
template(v-slot:body)
.MessageBox__body(ref="body")
......
......@@ -7,8 +7,9 @@
import {nextTick, reactive, ref} from "vue";
interface IModalProps {
minHeight?: number
minWidth?: number
minHeight?: number,
minWidth?: number,
closeOnBlur?: boolean,
}
interface IModalState {
......@@ -31,6 +32,7 @@
const props = withDefaults(defineProps<IModalProps>(), {
minHeight: 100,
minWidth: 150,
closeOnBlur: false,
})
const state: IModalState = reactive({
......@@ -109,6 +111,12 @@
state.resizingDirection = undefined
}
function onBlur() {
console.debug('Modal.onBlur')
if (props.closeOnBlur)
close()
}
async function show() {
state.isVisible = true
await nextTick()
......@@ -142,9 +150,11 @@
ref="backdrop"
v-show="state.isVisible"
@mousemove.stop="onMouseMove"
@mouseup="onMouseUp")
@mouseup="onMouseUp"
@click="onBlur")
.Modal(
ref="modal"
@click.stop
@mousedown="onMouseDown")
header.Modal__header(
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment