fix: change exported variable name to OverlayScrollbarsVue to fix its conflict with main library

fix: import OverlayScrollbars
change inner instance of OverlayScrollbars name to instance

Author: hamed-ehtesham

README.md

@@ -43,6 +43,8 @@ You can also provide options
 </overlay-scrollbars>
 ```
 
+To access OverlayScrollbars instance and for example add extensions to it see this [example](https://codepen.io/H4M3D3/pen/qJYjWq)
+
 If you have discovered a 🐜 or have a feature suggestion, feel free to create an [issue](https://github.com/parsisolution/os-vue/issues) on Github.
 
 # License

rollup.config.js

@@ -38,6 +38,8 @@ Released under the <%= pkg.license %> License.`,
     ]
 }
 
+let external = ['overlayscrollbars/js/OverlayScrollbars'];
+
 let plugins = defaultPlugins();
 plugins.splice(2, 1);
 
@@ -48,27 +50,28 @@ productionESPlugins[2] = uglifyES();
 let configs = [
     {
         input: path.resolve(src, 'plugin.common.js'),
-        // external: Object.keys(dependencies),
+        external,
         plugins,
         output: [
             {
                 format: 'cjs',
                 exports: 'named',
-                name: 'OverlayScrollbars',
+                name: 'OverlayScrollbarsVue',
                 file: path.resolve(dist, name + '.common.js'),
                 sourcemap: true
             },
             {
                 format: 'umd',
                 exports: 'named',
-                name: 'OverlayScrollbars',
+                name: 'OverlayScrollbarsVue',
                 file: path.resolve(dist, name + '.js'),
                 sourcemap: true
             }
         ],
     },
     {
         input: path.resolve(src, 'plugin.js'),
+        external,
         plugins,
         output: {
             format: 'es',
@@ -78,10 +81,11 @@ let configs = [
     },
     {
         input: path.resolve(src, 'OverlayScrollbars.js'),
+        external,
         plugins,
         output: {
             format: 'umd',
-            name: 'OverlayScrollbars',
+            name: 'OverlayScrollbarsVue',
             file: path.resolve(base, 'overlay-scrollbars.js'),
             // sourcemap: true
         },
@@ -92,28 +96,31 @@ if (process.env.NODE_ENV === 'production') {
     let newConfigs = [
         {
             input: path.resolve(src, 'plugin.common.js'),
+            external,
             plugins: productionPlugins,
             output: {
                 format: 'cjs',
                 exports: 'named',
-                name: 'OverlayScrollbars',
+                name: 'OverlayScrollbarsVue',
                 file: path.resolve(dist, name + '.common.min.js'),
                 sourcemap: true
             },
         },
         {
             input: path.resolve(src, 'plugin.common.js'),
+            external,
             plugins: productionPlugins,
             output: {
                 format: 'umd',
                 exports: 'named',
-                name: 'OverlayScrollbars',
+                name: 'OverlayScrollbarsVue',
                 file: path.resolve(dist, name + '.min.js'),
                 sourcemap: true
             },
         },
         {
             input: path.resolve(src, 'plugin.js'),
+            external,
             plugins: productionESPlugins,
             output: {
                 format: 'es',
@@ -123,10 +130,11 @@ if (process.env.NODE_ENV === 'production') {
         },
         {
             input: path.resolve(src, 'OverlayScrollbars.js'),
+            external,
             plugins: productionPlugins,
             output: {
                 format: 'umd',
-                name: 'OverlayScrollbars',
+                name: 'OverlayScrollbarsVue',
                 file: path.resolve(base, 'overlay-scrollbars.js'),
                 // sourcemap: true
             },

src/OverlayScrollbars.js

@@ -1,9 +1,11 @@
+import 'overlayscrollbars/js/OverlayScrollbars';
+
 export default {
     name: "overlay-scrollbars",
 
     data() {
         return {
-            oscroll: null,
+            instance: null,
         }
     },
 
@@ -15,13 +17,13 @@ export default {
     },
 
     mounted() {
-        if (!this.oscroll)
-            this.oscroll = OverlayScrollbars(this.$el, this.options);
+        if (!this.instance)
+            this.instance = OverlayScrollbars(this.$el, this.options);
     },
 
     beforeDestroy() {
-        this.oscroll.destroy();
-        this.oscroll = null;
+        this.instance.destroy();
+        this.instance = null;
     },
 
     render(h) {