Merge pull request #27 from gtm-nayan/cb-with-node

swyxio · Jan 19, 2022 · 8093bb6 · 8093bb6
2 parents 1729a5f + fdef4ea
commit 8093bb6
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -26,7 +26,12 @@ Available actions:
 
 ### `clickOutside`
 
-`export function clickOutside(node: HTMLElement, params: {enabled: boolean, cb: Function }): ReturnType<Action>`
+```ts
+export function clickOutside(node: HTMLElement, params: {
+	enabled: boolean, 
+	callback?: (node?: HTMLElement) => void;
+}): ReturnType<Action>
+```
 
 Call callback when user clicks outside a given element.
 
@@ -40,7 +45,7 @@ Demo: https://svelte.dev/repl/dae848c2157e48ab932106779960f5d5?version=3.19.2
 </script>
 
 
-<div use:clickOutside={{ enabled: open, cb: () => open = false }}>
+<div use:clickOutside={{ enabled: open, callback: () => open = false }}>
    <button on:click={() => open = true}>Open</button>
    {#if open}
     <span>
@@ -143,7 +148,7 @@ export function shortcut(node: Action, {
   shift?: boolean;
   alt?: boolean;
   code: string;
-  callback?: () => void;
+  callback?: (node?: HTMLElement) => void;
 })
 ```
 

diff --git a/src/clickOutside.ts b/src/clickOutside.ts
@@ -14,7 +14,7 @@ export function clickOutside(node: HTMLElement, params: {enabled: boolean, cb: F
   const { enabled: initialEnabled, cb } = params
 
     const handleOutsideClick = ({ target }: MouseEvent) => {
-      if (!node.contains(target as Node)) cb(); // typescript hack, not sure how to solve without asserting as Node
+      if (!node.contains(target as Node)) cb(node); // typescript hack, not sure how to solve without asserting as Node
     };
 
     function update({enabled}: {enabled: boolean}) {

diff --git a/src/shortcut.ts b/src/shortcut.ts
@@ -14,7 +14,7 @@ export type ShortcutSetting = {
 
   code: string;
 
-  callback?: () => void;
+  callback?: (node?: HTMLElement) => void;
 };
 export const shortcut: Action = (node, params: ShortcutSetting | undefined) => {
   let handler: ((e: KeyboardEvent) => void) | undefined;
@@ -35,7 +35,7 @@ export const shortcut: Action = (node, params: ShortcutSetting | undefined) => {
 
         e.preventDefault();
 
-        params.callback ? params.callback() : node.click();
+        params.callback ? params.callback(node) : node.click();
       };
       window.addEventListener('keydown', handler);
     };