Working modal component

templates/components/modal.html

@@ -1,23 +1,21 @@
 {% from "components/icon.html" import Icon %}
 
 {% macro Modal(name, dismissable=False) -%}
-  <Modal inline-template ref={{ name }}>
-    <div v-if='active'>
-      <div class='modal' v-on:click='handleDismiss'>
-        <div class='modal__dialog' role='dialog' aria-modal='true'>
+<div v-if='modals.{{name}} === true' v-cloak>
+    <div class='modal'>
+      <div class='modal__dialog' role='dialog' aria-modal='true'>
 
-          {% if dismissable %}
-            <button class='icon-link modal__dismiss' v-on:click='handleDismiss'>
-              {{ Icon('x') }}
-              <span>Close</span>
-            </button>
-          {% endif %}
+        {% if dismissable %}
+          <button class='icon-link modal__dismiss' v-on:click='closeModal("{{name}}")'>
+            {{ Icon('x') }}
+            <span>Close</span>
+          </button>
+        {% endif %}
 
-          <div class='modal__body'>
-              {{ caller() }}
-          </div>
+        <div class='modal__body'>
+            {{ caller() }}
         </div>
       </div>
     </div>
-  </Modal>
+  </div>
 {%- endmacro %}