Fix transitioning away

Fixes #17

The root problem here, which took me ages to find, was that `state` should not be reactive. It should only be set once the child has finished, via the nesting context.

src/lib/components/transitions/TransitionChild.svelte

@@ -140,7 +140,8 @@
   }
 
   let _cleanup = null;
-  $: if (mounted) {
+  $: {
+    if (mounted) {
       if (_cleanup) {
         _cleanup();
       }
@@ -150,6 +151,7 @@
       );
       initial = false;
     }
+  }
 
   setContext(NESTING_CONTEXT_NAME, nesting);
   let openClosedState: Writable<State> | undefined = writable(State.Closed);
@@ -164,5 +166,7 @@
 </script>
 
 <div bind:this={container} {...$$restProps}>
+  {#if state === TreeStates.Visible}
     <slot />
+  {/if}
 </div>

src/lib/components/transitions/TransitionRoot.svelte

@@ -120,23 +120,36 @@
 
   let openClosedState: Writable<State> | undefined = getContext("OpenClosed");
 
-  $: shouldShow = (() => {
+  function computeShow(
+    show: boolean,
+    openClosedState: State | undefined
+  ): boolean {
     if (show === null && openClosedState !== undefined) {
-      return match($openClosedState, {
+      return match(openClosedState, {
         [State.Open]: true,
         [State.Closed]: false,
       });
     }
 
     return show;
-  })();
+  }
 
-  $: if (shouldShow !== true && shouldShow !== false) {
+  let shouldShow = computeShow(
+    show,
+    openClosedState !== undefined ? $openClosedState : undefined
+  );
+  $: {
+    shouldShow = computeShow(
+      show,
+      openClosedState !== undefined ? $openClosedState : undefined
+    );
+    if (shouldShow !== true && shouldShow !== false) {
       throw new Error(
         "A <Transition /> is used but it is missing a `show={true | false}` prop."
       );
     }
-  $: state = shouldShow ? TreeStates.Visible : TreeStates.Hidden;
+  }
+  let state = shouldShow ? TreeStates.Visible : TreeStates.Hidden;
 
   let nestingBag: Writable<NestingContextValues> = writable();
   nestingBag.set(