@aotearoan/neon
Version:
Neon is a lightweight design library of Vue 3 components with minimal dependencies.
62 lines (61 loc) • 1.57 kB
JavaScript
import { defineComponent as m, ref as a, onMounted as r, onUnmounted as f, watch as d } from "vue";
import { NeonClosableUtils as p } from "../../../common/utils/NeonClosableUtils.es.js";
import c from "../../user-input/button/NeonButton.vue.es.js";
const B = m({
name: "NeonDrawer",
components: {
NeonButton: c
},
props: {
/**
* Whether the modal is currently open.
*/
open: { type: Boolean, required: !0 },
/**
* Whether the user is allowed to dismiss the modal by clicking outside the modal or pressing escape.
*/
dismissible: { type: Boolean, default: !0 },
/**
* Increase the opacity so that the page behind the modal is no longer visible
*/
opaque: { type: Boolean, default: !1 },
/**
* Keep the top nav visible when the modal is open
*/
showTopNav: { type: Boolean, default: !1 }
},
emits: [
/**
* Emitted when the modal is closed.
* @type {void}
*/
"close"
],
setup(e, { emit: i }) {
const l = a(null), n = a(null), u = () => {
i("close");
}, t = () => {
e.open && e.dismissible && u();
};
return r(() => {
e.dismissible && (n.value = l.value && new p(l.value, t) || null);
}), f(() => {
var o;
(o = n.value) == null || o.destroy();
}), d(
() => e.open,
(o) => {
var s;
o && ((s = n.value) == null || s.open());
},
{ immediate: !0 }
), {
modal: l,
close: t
};
}
});
export {
B as default
};
//# sourceMappingURL=NeonModal.es.js.map