feat: onClickOutside event

theKashey · Nov 7, 2018 · ed4d62b · ed4d62b
1 parent 82cc4bb
commit ed4d62b
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -18,6 +18,7 @@ Now you could __focus on__ a single task.
  - `[autoFocus]` - enables of disabled auto focus management (see [react-focus-lock documentation])
  - `[onActivation]` - on activation callback
  - `[onDeactivation]` - on deactivation callback
+ - `[onClickOutside]` - on click outside of "focus" area. (actually on any event "outside")
 
 ## Additional API
 ### Exposed from React-Focus-Lock

diff --git a/src/component.tsx b/src/component.tsx
@@ -9,6 +9,7 @@ export interface ReactFocusOnProps {
   autoFocus?: boolean;
   onActivation?: (node: HTMLElement) => void;
   onDeactivation?: () => void;
+  onClickOutside?: () => void;
 }
 
 export class ReactFocusOn extends Component<ReactFocusOnProps> {
@@ -31,10 +32,11 @@ export class ReactFocusOn extends Component<ReactFocusOnProps> {
   };
 
   render() {
-    const {children, autoFocus, enabled = true} = this.props;
+    const {children, autoFocus, onClickOutside, enabled = true} = this.props;
     return (
       <ScrollLocky
         enabled={enabled}
+        onEscape={onClickOutside}
       >
         <ReactFocusLock
           autoFocus={autoFocus}