Sha256: f8e4edd49c6fa49a6228c8039a41ea2232c2cfceada48159c49ad94b075d497d
Contents?: true
Size: 1.2 KB
Versions: 5
Compression:
Stored size: 1.2 KB
Contents
import { CocoComponent } from "@js/coco";
export default CocoComponent("modal", () => {
return {
open: false,
frame: null,
options: ["dismissable", "closeOnSubmit"],
init() {
this.onFrameSubmitEnd = this.onFrameSubmitEnd.bind(this);
this.frame = this.$el.closest("turbo-frame");
this.frame.addEventListener("turbo:submit-end", this.onFrameSubmitEnd);
this.$nextTick(() => this.show()); // ensure transitions run
},
show() {
this.open = true;
},
hide() {
this.open = false;
setTimeout(() => this.clearFrame(), 100);
},
dismiss(event) {
if (this.$options.dismissable) this.hide();
},
clearFrame() {
this.frame.removeAttribute("src");
this.frame.removeAttribute("complete");
this.frame.innerHTML = "";
},
onFrameSubmitEnd() {
if (this.$options.closeOnSubmit && event.detail.success) {
this.hide();
}
},
destroy() {
this.frame.removeEventListener("turbo:submit-end", this.onFrameSubmitEnd);
},
root: {
"x-options": "options",
"x-show": "open",
"@keydown.escape.document": "dismiss",
"@modal:hide.document": "hide",
},
};
});
Version data entries
5 entries across 5 versions & 1 rubygems