From 81f13416aec7bf46c7baa9bf8800bb5d4831ca90 Mon Sep 17 00:00:00 2001
From: Matt Mo <matt@montoyatech.com>
Date: Tue, 29 Sep 2020 14:25:30 -0700
Subject: [PATCH] Added a bootstrap modal template to help work with modals.

---
 ignite-bootstrap.js |  4 +++-
 modal.js            | 52 +++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 55 insertions(+), 1 deletion(-)
 create mode 100644 modal.js

diff --git a/ignite-bootstrap.js b/ignite-bootstrap.js
index 3bfe541..783d436 100644
--- a/ignite-bootstrap.js
+++ b/ignite-bootstrap.js
@@ -1,7 +1,9 @@
 import { DropdownMenu } from "./dropdown-menu.js";
 import { DropdownButton } from "./dropdown-button.js";
+import { Modal } from "./modal.js";
 
 export {
     DropdownMenu,
-    DropdownButton
+    DropdownButton,
+    Modal
 }
\ No newline at end of file
diff --git a/modal.js b/modal.js
new file mode 100644
index 0000000..4462d51
--- /dev/null
+++ b/modal.js
@@ -0,0 +1,52 @@
+import { IgniteElement } from "../ignite-html/ignite-element.js";
+import { IgniteTemplate, div, slot } from "../ignite-html/ignite-template.js";
+
+class Modal extends IgniteElement {
+    constructor() {
+        super();
+    }
+
+    get properties() {
+        return {
+            dialogClasses: null,
+            modal: null,
+            modalInstance: null
+        };
+    }
+
+    render() {
+        return this.template.child(
+            new div().class("modal").ref(this.modal).child(
+                new div().class("modal-dialog").class(this.dialogClasses).child(
+                    new div().class("modal-content").child(
+                        new slot(this)
+                    )
+                )
+            )
+        )
+    }
+
+    ready() {
+        this.modalInstance = new bootstrap.Modal(this.modal);
+    }
+
+    show() {
+        this.modalInstance.show();
+    }
+
+    hide() {
+        this.modalInstance.hide();
+    }
+}
+
+customElements.define("bt-modal", Modal);
+
+class ModalTemplate extends IgniteTemplate {
+    constructor(...children) {
+        super("bt-modal", children);
+    }
+}
+
+export {
+    ModalTemplate as Modal
+}
\ No newline at end of file