@esportsplus/ui 0.0.19 → 0.0.20

package/build/components/root/index.d.ts

@@ -1,4 +1,5 @@
 import layout from './layout';
+import queue from './queue';
 declare const _default: {
     layout: (data?: {
         overlay?: {
@@ -17,6 +18,9 @@ declare const _default: {
         type: string;
         values: never[];
     };
+    queue: {
+        onclick: (fn: VoidFunction) => void;
+    };
 };
 export default _default;
-export { layout };
+export { layout, queue };

package/build/components/root/index.js

@@ -1,3 +1,4 @@
 import layout from './layout';
-export default { layout };
-export { layout };
+import queue from './queue';
+export default { layout, queue };
+export { layout, queue };

package/build/components/root/queue.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    onclick: (fn: VoidFunction) => void;
+};
+export default _default;

package/build/components/root/queue.js

@@ -0,0 +1,18 @@
+import events from '@esportsplus/delegated-events';
+let initialized = false, queue = [];
+const onclick = (fn) => {
+    if (!initialized) {
+        events.register(document.body, 'click', async () => {
+            if (!queue.length) {
+                return;
+            }
+            let items = queue.splice(0);
+            for (let i = 0, n = items.length; i < n; i++) {
+                await items[i]();
+            }
+        });
+        initialized = true;
+    }
+    queue.push(fn);
+};
+export default { onclick };

package/build/components/tooltip/index.js

@@ -1,21 +1,8 @@
 import { reactive } from '@esportsplus/reactivity';
 import { html } from '@esportsplus/template';
-import events from '@esportsplus/delegated-events';
+import { root } from '../../components';
 import menu from './menu';
-let initialized = false, root = [];
 const onclick = ({ active, toggle }) => {
-    if (!initialized) {
-        events.register(document.body, 'click', () => {
-            if (!root.length) {
-                return;
-            }
-            let deactivate = root.splice(0);
-            for (let i = 0, n = deactivate.length; i < n; i++) {
-                deactivate[i].active = false;
-            }
-        });
-        initialized = true;
-    }
     let state = reactive({
         active: active || false
     });
@@ -30,7 +17,7 @@ const onclick = ({ active, toggle }) => {
             }
             state.active = active;
             if (active) {
-                root.push(state);
+                root.queue.onclick(() => state.active = false);
             }
         }
     });

package/package.json

@@ -37,5 +37,5 @@
         "prepublishOnly": "npm run build"
     },
     "types": "./build/index.d.ts",
-    "version": "0.0.19"
+    "version": "0.0.20"
 }

package/src/components/root/index.ts

@@ -1,5 +1,6 @@
 import layout from './layout';
+import queue from './queue';
 
 
-export default { layout };
-export { layout };
+export default { layout, queue };
+export { layout, queue };

package/src/components/root/queue.ts

@@ -0,0 +1,28 @@
+import events from '@esportsplus/delegated-events';
+
+
+let initialized = false,
+    queue: VoidFunction[] = [];
+
+
+const onclick = (fn: VoidFunction) => {
+    if (!initialized) {
+        events.register(document.body, 'click', async () => {
+            if (!queue.length) {
+                return;
+            }
+
+            let items = queue.splice(0);
+
+            for (let i = 0, n = items.length; i < n; i++) {
+                await items[i]();
+            }
+        });
+        initialized = true;
+    }
+
+    queue.push(fn);
+};
+
+
+export default { onclick };

package/src/components/tooltip/index.ts

@@ -1,29 +1,10 @@
 import { reactive } from '@esportsplus/reactivity';
 import { html } from '@esportsplus/template';
-import events from '@esportsplus/delegated-events';
+import { root } from '~/components';
 import menu from './menu';
 
 
-let initialized = false,
-    root: { active: boolean }[] = [];
-
-
 const onclick = ({ active, toggle }: { active?: boolean, toggle?: boolean }) => {
-    if (!initialized) {
-        events.register(document.body, 'click', () => {
-            if (!root.length) {
-                return;
-            }
-
-            let deactivate = root.splice(0);
-
-            for (let i = 0, n = deactivate.length; i < n; i++) {
-                deactivate[i].active = false;
-            }
-        });
-        initialized = true;
-    }
-
     let state = reactive({
             active: active || false
         });
@@ -42,7 +23,7 @@ const onclick = ({ active, toggle }: { active?: boolean, toggle?: boolean }) =>
             state.active = active;
 
             if (active) {
-                root.push(state);
+                root.queue.onclick(() => state.active = false);
             }
         }
     });