From f355f52071a4bac485fcd4a0b51fb20bf7f47d41 Mon Sep 17 00:00:00 2001
From: Marcus Feitoza <marcus.feitoza.filho@gmail.com>
Date: Sun, 3 May 2020 02:38:40 -0300
Subject: [PATCH] fix(modal): fix focus and events

---
 src/components/Modal/Modal.svelte | 24 ++++++++++++++----------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/components/Modal/Modal.svelte b/src/components/Modal/Modal.svelte
index 32c0217d..5f689b10 100644
--- a/src/components/Modal/Modal.svelte
+++ b/src/components/Modal/Modal.svelte
@@ -19,7 +19,7 @@
   export let size = undefined;
   export let style = undefined;
 
-  import { createEventDispatcher, afterUpdate, onDestroy, onMount } from 'svelte';
+  import { createEventDispatcher, afterUpdate, onDestroy } from 'svelte';
   import Close20 from 'carbon-icons-svelte/lib/Close20';
   import { cx } from '../../lib';
   import Button from '../Button';
@@ -30,22 +30,26 @@
   let outerModal = undefined;
   let innerModal = undefined;
 
+  let opened = false
+
   // TODO: reuse in ComposedModal
   function focus(element) {
     const node = (element || innerModal).querySelector(selectorPrimaryFocus) || buttonRef;
     node.focus();
   }
 
-  onMount(() => {
-    focus();
-    dispatch('open');
-    document.body.classList.add(cx('--body--with-modal-open'));
-  })
-
   afterUpdate(() => {
-    if (!open) {
-      dispatch('close');
-      document.body.classList.remove(cx('--body--with-modal-open'));
+    if (opened) {
+      if (!open) {
+        opened = false;
+        dispatch('close');
+        document.body.classList.remove(cx('--body--with-modal-open'));
+      }
+    } else if (open) {
+      opened = true;
+      focus();
+      dispatch('open');
+      document.body.classList.add(cx('--body--with-modal-open'));
     }
   });