Fix, #26

CHANGELOG.md

@@ -1,5 +1,8 @@
 # Changelog
 
+### [3.3.3](https://github.com/ankurk91/vue-loading-overlay/compare/3.3.2...3.3.3)
+* Fix: [#26](https://github.com/ankurk91/vue-loading-overlay/issues/26) by introducing `enforceFocus` prop
+
 ### [3.3.2](https://github.com/ankurk91/vue-loading-overlay/compare/3.3.1...3.3.2)
 * Fix: revert [#44](https://github.com/ankurk91/vue-loading-overlay/issues/44) 
     to fix [#46](https://github.com/ankurk91/vue-loading-overlay/issues/46)

README.md

@@ -129,7 +129,8 @@ The component accepts these props:
 | loader           | String              | `spinner`            | Name of icon shape you want use as loader, `spinner` or `dots` or `bars` |
 | background-color | String              | `#fff`               | Customize the overlay background color |
 | opacity          | Number              | `0.5`                | Customize the overlay background opacity |
-| z-index          | Number              | `9999`                | Customize the overlay z-index |
+| z-index          | Number              | `9999`               | Customize the overlay z-index |
+| enforce-focus    | Boolean             | `true`               | Force focus on loader |
 
 * ^When `is-full-page` is set to `false`, the container element should be positioned as `position: relative`. 
 You can use CSS helper class `vld-parent`.

src/js/Component.vue

@@ -38,6 +38,10 @@
         type: Boolean,
         default: true
       },
+      enforceFocus: {
+        type: Boolean,
+        default: true
+      },
       transition: {
         type: String,
         default: 'fade'

src/js/trapFocusMixin.js

@@ -1,6 +1,8 @@
 export default {
   mounted() {
-    document.addEventListener('focusin', this.focusIn)
+    if(this.enforceFocus){
+      document.addEventListener('focusin', this.focusIn)
+    }
   },
   methods: {
     /**