ngx, react & vue wrapper final touch

packages/overlayscrollbars-ngx/example/package-lock.json

@@ -1357,9 +1357,9 @@
       "optional": true
     },
     "async-limiter": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.0.tgz",
-      "integrity": "sha512-jp/uFnooOiO+L211eZOoSyzpOITMXx1rBITauYykG3BRYPu8h0UcxsPNB04RR5vo4Tyz3+ay17tR6JVf9qzYWg==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz",
+      "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ==",
       "dev": true
     },
     "asynckit": {
@@ -2039,9 +2039,9 @@
       }
     },
     "caniuse-lite": {
-      "version": "1.0.30000985",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000985.tgz",
-      "integrity": "sha512-1ngiwkgqAYPG0JSSUp3PUDGPKKY59EK7NrGGX+VOxaKCNzRbNc7uXMny+c3VJfZxtoK3wSImTvG9T9sXiTw2+w==",
+      "version": "1.0.30000988",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000988.tgz",
+      "integrity": "sha512-lPj3T8poYrRc/bniW5SQPND3GRtSrQdUM/R4mCYTbZxyi3jQiggLvZH4+BYUuX0t4TXjU+vMM7KFDQg+rSzZUQ==",
       "dev": true
     },
     "canonical-path": {
@@ -2317,9 +2317,9 @@
       "dev": true
     },
     "compare-versions": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.5.0.tgz",
-      "integrity": "sha512-hX+4kt2Rcwu+x1U0SsEFCn1quURjEjPEGH/cPBlpME/IidGimAdwfMU+B+xDr7et/KTR7VH2+ZqWGerv4NGs2w==",
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.5.1.tgz",
+      "integrity": "sha512-9fGPIB7C6AyM18CJJBHt5EnCZDG3oiTJYy0NjfIAGjKpzv0tkxWko7TNQHF5ymqm7IH03tqmeuBxtvD+Izh6mg==",
       "dev": true
     },
     "component-bind": {
@@ -2967,9 +2967,9 @@
       "dev": true
     },
     "electron-to-chromium": {
-      "version": "1.3.201",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.201.tgz",
-      "integrity": "sha512-aCTPIfY1Jvuam5b6vuWRjt1F8i4kY7zX0Qtpu5SNd6l1zjuxU9fDNpbM4o6+oJsra+TMD2o7D20GnkSIgpTr9w==",
+      "version": "1.3.212",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.212.tgz",
+      "integrity": "sha512-H8z5Smi1s1u1zGegEBfbxUAzrxyk1JoRHHHrlNGfhxv3sTb+p/Jz7JDvrR4196Q/Ip8r4+XwWcLvKrUjFKoJAg==",
       "dev": true
     },
     "elliptic": {
@@ -3238,9 +3238,9 @@
       "dev": true
     },
     "esutils": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
-      "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs=",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
+      "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
       "dev": true
     },
     "etag": {
@@ -3927,14 +3927,12 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -3949,20 +3947,17 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -4079,8 +4074,7 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "ini": {
           "version": "1.3.5",
@@ -4092,7 +4086,6 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -4107,7 +4100,6 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -4115,14 +4107,12 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "minipass": {
           "version": "2.3.5",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -4141,7 +4131,6 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -4222,8 +4211,7 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -4235,7 +4223,6 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -4357,7 +4344,6 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -7020,9 +7006,9 @@
       },
       "dependencies": {
         "resolve": {
-          "version": "1.11.1",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.11.1.tgz",
-          "integrity": "sha512-vIpgF6wfuJOZI7KKKSP+HmiKggadPQAdsp5HiC1mvqnfp0gF1vdwgBWZIdrVft9pgqoMFQN+R7BSWZiBxx+BBw==",
+          "version": "1.12.0",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.12.0.tgz",
+          "integrity": "sha512-B/dOmuoAik5bKcD6s6nXDCjzUKnaDvdkRyAk6rsmsKLipWj4797iothd7jmmUhWTfinVMU+wc56rYKsit2Qy4w==",
           "dev": true,
           "requires": {
             "path-parse": "^1.0.6"
@@ -8038,9 +8024,9 @@
           "dev": true
         },
         "webdriver-manager": {
-          "version": "12.1.5",
-          "resolved": "https://registry.npmjs.org/webdriver-manager/-/webdriver-manager-12.1.5.tgz",
-          "integrity": "sha512-f1apDjMpZ8SHlXtXGzqBxOjV+WQcDRz5PN7pWScgjXS7vhUIFcM3V89Shetf4A04n8DDR2MxiVQq6JproFcRZw==",
+          "version": "12.1.6",
+          "resolved": "https://registry.npmjs.org/webdriver-manager/-/webdriver-manager-12.1.6.tgz",
+          "integrity": "sha512-B1mOycNCrbk7xODw7Jgq/mdD3qzPxMaTsnKIQDy2nXlQoyjTrJTTD0vRpEZI9b8RibPEyQvh9zIZ0M1mpOxS3w==",
           "dev": true,
           "requires": {
             "adm-zip": "^0.4.9",
@@ -8081,9 +8067,9 @@
       "dev": true
     },
     "psl": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/psl/-/psl-1.2.0.tgz",
-      "integrity": "sha512-GEn74ZffufCmkDDLNcl3uuyF/aSD6exEyh1v/ZSdAomB82t6G9hzJVRx0jBmLDW+VfZqks3aScmMw9DszwUalA==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/psl/-/psl-1.3.0.tgz",
+      "integrity": "sha512-avHdspHO+9rQTLbv1RO+MPYeP/SzsCoxofjVnHanETfQhTJrmB0HlDoW+EiN/R+C0BZ+gERab9NY0lPN2TxNag==",
       "dev": true
     },
     "public-encrypt": {
@@ -9732,9 +9718,9 @@
           "dev": true
         },
         "source-map-support": {
-          "version": "0.5.12",
-          "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.12.tgz",
-          "integrity": "sha512-4h2Pbvyy15EE02G+JOZpUCmqWJuqrs+sEkzewTm++BPi7Hvn/HwcqLAcNxYAyI0x13CpPPn+kMjl+hplXMHITQ==",
+          "version": "0.5.13",
+          "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
+          "integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
           "dev": true,
           "requires": {
             "buffer-from": "^1.0.0",
@@ -10143,9 +10129,9 @@
       },
       "dependencies": {
         "resolve": {
-          "version": "1.11.1",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.11.1.tgz",
-          "integrity": "sha512-vIpgF6wfuJOZI7KKKSP+HmiKggadPQAdsp5HiC1mvqnfp0gF1vdwgBWZIdrVft9pgqoMFQN+R7BSWZiBxx+BBw==",
+          "version": "1.12.0",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.12.0.tgz",
+          "integrity": "sha512-B/dOmuoAik5bKcD6s6nXDCjzUKnaDvdkRyAk6rsmsKLipWj4797iothd7jmmUhWTfinVMU+wc56rYKsit2Qy4w==",
           "dev": true,
           "requires": {
             "path-parse": "^1.0.6"

packages/overlayscrollbars-ngx/example/src/app/app.component.css

@@ -1,3 +1,7 @@
+:host {
+    min-width: 600px;
+    display: block;
+}
 .header {
     background: #36befd;
     background: -moz-linear-gradient(-45deg, #36befd 1%, #6461f6 100%);

packages/overlayscrollbars-ngx/example/src/app/app.component.html

@@ -41,10 +41,12 @@
         </div>
         <div class="content-section-content">
 
-            <overlay-scrollbars #osComponentRef1 [options]="osComponentOptions" [ngStyle]="{ maxHeight:'350px' }" [ngClass]="['custom-class-name-test', framework]">
+            <overlay-scrollbars #osComponentRef1 [options]="osComponentOptions" [ngStyle]="{ maxHeight:'350px' }"
+                [ngClass]="['custom-class-name-test', framework]">
                 <div class="bonus-content">{{ componentContent }}</div>
                 {{ loremIpsumShort }}
-                <overlay-scrollbars #osComponentRef2 [options]="osComponentOptions" [ngStyle]="{ maxHeight:'150px' }" [ngClass]="['custom-class-name-test']">
+                <overlay-scrollbars #osComponentRef2 [options]="osComponentOptions" [ngStyle]="{ maxHeight:'150px' }"
+                    [ngClass]="['custom-class-name-test']">
                     <div class="bonus-content">{{ componentContent }}</div>
                     {{ loremIpsumLong }}
                     <br />

packages/overlayscrollbars-ngx/example/src/app/app.component.ts

@@ -1,6 +1,6 @@
 import { Component, ViewChild, ElementRef, Input } from '@angular/core';
 import { OverlayScrollbarsComponent } from 'overlayscrollbars-ngx';
-import OverlayScrollbarsfrom from 'overlayscrollbars';
+import OverlayScrollbars from 'overlayscrollbars';
 
 @Component({
     selector: 'app-root',
@@ -60,24 +60,24 @@ export class AppComponent {
     onBtnChangeContent(event) {
         let loremIpsums = [this.loremIpsumLong, this.loremIpsumMedium, this.loremIpsumShort];
         let random = Math.floor(Math.random() * loremIpsums.length);
-        this.componentContent = this.componentContent + "\r\n" + loremIpsums[random]
+        this.componentContent = this.componentContent + '\r\n' + loremIpsums[random]
     }
 
     onBtnLog(event) {
         console.log(`== ${this.componentClass} (1) ==`);
-        console.log("Ref:");
+        console.log('Ref:');
         console.log(this.osComponentRef1);
-        console.log("Instance:");
+        console.log('Instance:');
         console.log(this.osComponentRef1.osInstance());
-        console.log("Target:");
+        console.log('Target:');
         console.log(this.osComponentRef1.osTarget());
-        console.log("");
+        console.log('');
         console.log(`== ${this.componentClass} (2) ==`);
-        console.log("Ref:");
+        console.log('Ref:');
         console.log(this.osComponentRef2);
-        console.log("Instance:");
+        console.log('Instance:');
         console.log(this.osComponentRef2.osInstance());
-        console.log("Target:");
+        console.log('Target:');
         console.log(this.osComponentRef2.osTarget());
     }
 }