diff --git a/example/tree-menu.tsx b/example/tree-menu.tsx
index 275ea72..aaafd23 100644
--- a/example/tree-menu.tsx
+++ b/example/tree-menu.tsx
@@ -17,13 +17,14 @@ export const Menu =(props:{children:React.JSX.Element|React.JSX.Element[]})=>
     const [stateGet, stateSet] = React.useContext(CTX);
     const refElement:React.MutableRefObject<HTMLElement|null> = React.useRef( null );
     const refControl:React.MutableRefObject<CollapseControls|null> = React.useRef( null );
+    const refInitial:React.MutableRefObject<boolean> = React.useRef(true);
 
     type MenuClassStates = {Keep:string, Open:string, Shut:string, Move:string, Exit:string};
     const base = `relative transition-all border(8 black) overflow-hidden`;
     const Classes:MenuClassStates =
     {
-      Shut: `${base} h-0    top-0  w-1/2   duration-500`,
-      Open: `${base} h-auto top-8  w-full  duration-500`,
+      Shut: `${base} h-0    top-0  w-1/2   duration-300`,
+      Open: `${base} h-auto top-8  w-full  duration-700`,
       lol: `${base} h-auto top-36 bg-yellow-500  w-2/3  duration-700`,
     };
     const Window = window as {TwindInst?:(c:string)=>string};
@@ -35,20 +36,21 @@ export const Menu =(props:{children:React.JSX.Element|React.JSX.Element[]})=>
       }
     }
 
-    React.useEffect(()=> {
-      refElement.current?.setAttribute("style", "");
-      refControl.current = refElement.current && Collapser(refElement.current, stateGet.open ? "Open" : "Shut", Classes);
-    }, []);
-    React.useEffect(()=> {refControl.current && refControl.current(stateGet.open ? "Open" : "Shut", ()=>stateSet({done:true}))}, [stateGet.open])
-
-    useAway(refElement, (e)=>
+    React.useEffect(()=>
     {
-      //e.stopPropagation();
-      stateSet({open:false, done:false});
+      refControl.current = refElement.current && Collapser(refElement.current, stateGet.open ? "Open" : "Shut", Classes);
     }
-    );
+    , []);
+    React.useEffect(()=>
+    {
+      (!refInitial.current && refControl.current) && refControl.current(stateGet.open ? "Open" : "Shut", ()=>stateSet({done:true}));
+      refInitial.current = false;
+    }
+    , [stateGet.open]);
 
-    return <div ref={refElement as React.Ref<HTMLDivElement>} class={Classes.Shut} style="transition:none;">
+    useAway(refElement, (e)=>stateSet({open:false, done:false}) );
+
+    return <div ref={refElement as React.Ref<HTMLDivElement>} class={Classes.Shut}>
       { (!stateGet.open && stateGet.done) ? null : props.children}
     </div>;
 };
@@ -68,8 +70,6 @@ const Refs:Map<HTMLElement, React.Ref<Handler>> = new Map();
 function isHighest(inElement:HTMLElement, inSelection:HTMLElement[])
 {
   let currentNode = inElement;
-  let highest:HTMLElement|false = false;
-
   while (currentNode != document.body)
   {
     currentNode = currentNode.parentNode as HTMLElement;
@@ -78,7 +78,6 @@ function isHighest(inElement:HTMLElement, inSelection:HTMLElement[])
       return false;
     }    
   }
-
   return true;
 }
 window.innerWidth && document.addEventListener("click", e=>
@@ -145,7 +144,7 @@ const StyleCalc =(inElement:HTMLElement, inClasses:StylePack)=>
   return output;
 };
 
-type DoneCallback =(openState:boolean)=>void;
+type DoneCallback =(inState:string)=>void;
 export type CollapseControls =(inOpen?:string, inDone?:DoneCallback)=>void;
 export function Collapser(inElement:HTMLElement, initialState:string, library:Record<string, string>)
 {
@@ -153,7 +152,6 @@ export function Collapser(inElement:HTMLElement, initialState:string, library:Re
     let userMode = initialState;
     let frameRequest = 0;
     let inTransition = false;
-    let interrupted = false;
     let measurements:StyleCalc;
     const transitions:Set<string> = new Set();