@libs-ui/components-scroll-overlay 0.2.29 → 0.2.30-6.2

package/README.md

@@ -1,3 +1,135 @@
-# scroll-overlay
+# Scroll Overlay Component
 
-This library was generated with [Nx](https://nx.dev).
+## Giới thiệu
+
+`scroll-overlay` là một directive mạnh mẽ giúp tuỳ biến thanh cuộn (scrollbar) cho bất kỳ phần tử nào trong ứng dụng Angular. Directive này cung cấp giao diện thanh cuộn đẹp, có thể tuỳ chỉnh màu sắc, kích thước, hiệu ứng hover, và nhiều tuỳ chọn nâng cao khác.
+
+## Tính năng
+
+- Tuỳ chỉnh màu sắc, chiều rộng, padding của thanh cuộn
+- Hỗ trợ cả chiều ngang (X) và dọc (Y)
+- Hiệu ứng hover cho track và thumb
+- Ẩn/hiện scrollbar khi hover hoặc theo tuỳ chọn
+- Hỗ trợ drag & drop thumb để cuộn
+- Sự kiện scroll chi tiết (top, bottom, X, Y)
+- Dễ dàng tích hợp vào bất kỳ container nào
+
+## Cài đặt
+
+Cài đặt package qua npm hoặc yarn:
+
+```bash
+npm install @libs-ui/components-scroll-overlay
+```
+
+hoặc
+
+```bash
+yarn add @libs-ui/components-scroll-overlay
+```
+
+## Sử dụng
+
+### Import directive
+
+```typescript
+import { LibsUiComponentsScrollOverlayDirective } from '@libs-ui/components-scroll-overlay';
+
+@Component({
+  selector: 'app-example',
+  standalone: true,
+  imports: [LibsUiComponentsScrollOverlayDirective],
+  template: `
+    <div LibsUiComponentsScrollOverlayDirective style="width: 300px; height: 400px;">
+      Nội dung dài ở đây...
+    </div>
+  `
+})
+export class ExampleComponent {}
+```
+
+### Ví dụ nâng cao với options
+
+```html
+<div LibsUiComponentsScrollOverlayDirective
+     [options]="{scrollbarWidth: 12, scrollbarColor: '#eee', scrollThumbColor: '#888', scrollYOpacity0: true}"
+     style="width: 300px; height: 400px;">
+  Nội dung dài ở đây...
+</div>
+```
+
+## API Reference
+
+### Inputs
+
+| Input                  | Type                        | Mô tả                                                                 |
+|------------------------|-----------------------------|-----------------------------------------------------------------------|
+| options                | IScrollOverlayOptions       | Tuỳ chọn cấu hình thanh cuộn                                          |
+| debugMode              | boolean                     | Bật chế độ debug                                                      |
+| ignoreInit             | boolean                     | Bỏ qua khởi tạo directive                                             |
+| classContainer         | string                      | Thêm class cho container bọc ngoài                                    |
+| notShowScrollBarX      | boolean                     | Không hiển thị thanh cuộn ngang                                       |
+| notShowScrollBarY      | boolean                     | Không hiển thị thanh cuộn dọc                                         |
+| elementCheckScrollX    | HTMLElement                 | Phần tử dùng để kiểm tra scroll X (mặc định là chính element)         |
+| elementCheckScrollY    | HTMLElement                 | Phần tử dùng để kiểm tra scroll Y (mặc định là chính element)         |
+| elementScroll          | HTMLElement                 | Phần tử thực hiện scroll (mặc định là chính element)                  |
+
+### Outputs
+
+| Output           | Type   | Mô tả                                              |
+|------------------|--------|---------------------------------------------------|
+| outScroll        | Event  | Bắn ra khi scroll bất kỳ                           |
+| outScrollX       | Event  | Bắn ra khi scroll theo chiều ngang                 |
+| outScrollY       | Event  | Bắn ra khi scroll theo chiều dọc                   |
+| outScrollTop     | Event  | Bắn ra khi scroll tới đầu (top)                    |
+| outScrollBottom  | Event  | Bắn ra khi scroll tới cuối (bottom)                |
+
+### Options (IScrollOverlayOptions)
+
+| Thuộc tính           | Type      | Mô tả                                                        |
+|----------------------|-----------|--------------------------------------------------------------|
+| scrollbarWidth       | number    | Chiều rộng/thanh cuộn (px)                                   |
+| scrollbarColor       | string    | Màu nền track                                                |
+| scrollbarHoverColor  | string    | Màu nền track khi hover                                      |
+| scrollThumbColor     | string    | Màu thumb                                                    |
+| scrollThumbHoverColor| string    | Màu thumb khi hover                                          |
+| scrollbarPadding     | number    | Padding của scrollbar                                        |
+| scrollX              | 'hidden'\|'scroll' | Kiểu hiển thị scroll X ('hidden' hoặc 'scroll')         |
+| scrollXOpacity0      | boolean   | Ẩn track X khi không hover                                   |
+| scrollY              | 'hidden'\|'scroll' | Kiểu hiển thị scroll Y ('hidden' hoặc 'scroll')         |
+| scrollYOpacity0      | boolean   | Ẩn track Y khi không hover                                   |
+
+## Interface
+
+```typescript
+export interface IScrollOverlayOptions {
+  scrollbarWidth?: number;
+  scrollbarColor?: string;
+  scrollbarHoverColor?: string;
+  scrollThumbColor?: string;
+  scrollThumbHoverColor?: string;
+  scrollbarPadding?: number;
+  scrollX?: 'hidden' | 'scroll';
+  scrollXOpacity0?: boolean;
+  scrollY?: 'hidden' | 'scroll';
+  scrollYOpacity0?: boolean;
+}
+```
+
+## Ví dụ sử dụng nâng cao
+
+```html
+<!-- Scroll overlay với tuỳ chỉnh màu sắc và hiệu ứng ẩn/hiện -->
+<div LibsUiComponentsScrollOverlayDirective
+     [options]="{scrollbarWidth: 8, scrollbarColor: '#f3f4f6', scrollThumbColor: '#3b82f6', scrollThumbHoverColor: '#2563eb', scrollYOpacity0: true}"
+     style="width: 250px; height: 350px;">
+  <div style="height: 1000px;">
+    Nội dung rất dài để test scroll overlay...
+  </div>
+</div>
+```
+
+## Ghi chú
+- Directive này hoạt động tốt với mọi phần tử có overflow.
+- Có thể kết hợp nhiều options để đạt hiệu quả UI mong muốn.
+- Để tuỳ chỉnh sâu hơn, hãy xem thêm code và các sự kiện output để tích hợp logic riêng.

package/demo/scroll-overlay.demo.d.ts

@@ -0,0 +1,44 @@
+import { IScrollOverlayOptions } from '../scroll.interface';
+import * as i0 from "@angular/core";
+export declare class LibsUiComponentsScrollOverlayDemoComponent {
+    longContent: import("@angular/core").WritableSignal<string>;
+    longHorizontalContent: import("@angular/core").WritableSignal<string>;
+    scenarioOptions: readonly ["default", "customStyle", "autoHide", "horizontal"];
+    selectedScenario: typeof this.scenarioOptions[number];
+    customStyleOptions: import("@angular/core").WritableSignal<IScrollOverlayOptions>;
+    autoHideOptions: import("@angular/core").WritableSignal<IScrollOverlayOptions>;
+    horizontalOptions: import("@angular/core").WritableSignal<IScrollOverlayOptions>;
+    lastEvent: import("@angular/core").WritableSignal<string>;
+    get options(): IScrollOverlayOptions | undefined;
+    get content(): string;
+    onScroll(): void;
+    onScrollTop(): void;
+    onScrollBottom(): void;
+    inputsDoc: {
+        name: string;
+        type: string;
+        default: string;
+        description: string;
+    }[];
+    outputsDoc: {
+        name: string;
+        type: string;
+        description: string;
+    }[];
+    optionsDoc: {
+        name: string;
+        type: string;
+        default: string;
+        description: string;
+    }[];
+    interfacesDoc: {
+        name: string;
+        type: string;
+        description: string;
+    }[];
+    installCommandNpm: string;
+    installCommandYarn: string;
+    copyToClipboard(text: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsScrollOverlayDemoComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsScrollOverlayDemoComponent, "lib-scroll-overlay-demo", never, {}, {}, never, never, true, never>;
+}

package/esm2022/demo/scroll-overlay.demo.mjs

@@ -0,0 +1,78 @@
+import { CommonModule } from '@angular/common';
+import { Component, signal } from '@angular/core';
+import { LibsUiComponentsScrollOverlayDirective } from '../scroll-overlay.directive';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+export class LibsUiComponentsScrollOverlayDemoComponent {
+    // Demo text content: generate 5000 words for vertical scrolling
+    longContent = signal(Array.from({ length: 5000 }, (_, i) => `Lorem${i + 1}`).join(' '));
+    // Demo horizontal content: generate 5000 words for horizontal scrolling
+    longHorizontalContent = signal(Array.from({ length: 5000 }, (_, i) => `Word${i + 1}`).join(' '));
+    // Scenario selection
+    scenarioOptions = ['default', 'customStyle', 'autoHide', 'horizontal'];
+    selectedScenario = 'default';
+    // Options signals
+    customStyleOptions = signal({ scrollbarWidth: 12, scrollbarColor: '#f3f4f6', scrollbarHoverColor: '#e5e7eb', scrollThumbColor: '#3b82f6', scrollThumbHoverColor: '#2563eb', scrollbarPadding: 4 });
+    autoHideOptions = signal({ scrollYOpacity0: true, scrollbarWidth: 8, scrollbarColor: 'transparent', scrollThumbColor: '#9ca3af', scrollThumbHoverColor: '#6b7280' });
+    horizontalOptions = signal({ scrollX: 'scroll', scrollY: 'hidden', scrollbarWidth: 8, scrollbarColor: '#f3f4f6', scrollThumbColor: '#3b82f6' });
+    // Scroll event log
+    lastEvent = signal('No events yet');
+    // Helpers
+    get options() {
+        switch (this.selectedScenario) {
+            case 'customStyle': return this.customStyleOptions();
+            case 'autoHide': return this.autoHideOptions();
+            case 'horizontal': return this.horizontalOptions();
+            default: return undefined;
+        }
+    }
+    get content() {
+        return this.selectedScenario === 'horizontal'
+            ? this.longHorizontalContent()
+            : this.longContent();
+    }
+    // Event handlers
+    onScroll() { this.lastEvent.set('Scroll event fired'); }
+    onScrollTop() { this.lastEvent.set('Reached top'); }
+    onScrollBottom() { this.lastEvent.set('Reached bottom'); }
+    // API docs
+    inputsDoc = [
+        { name: 'options', type: 'IScrollOverlayOptions', default: 'undefined', description: 'Cấu hình tuỳ chỉnh scrollbar' },
+        { name: 'debugMode', type: 'boolean', default: 'false', description: 'Bật chế độ debug' },
+        { name: 'notShowScrollBarX', type: 'boolean', default: 'false', description: 'Ẩn scrollbar ngang' },
+        { name: 'notShowScrollBarY', type: 'boolean', default: 'false', description: 'Ẩn scrollbar dọc' }
+    ];
+    outputsDoc = [
+        { name: 'outScroll', type: 'Event', description: 'Bắn ra khi scroll bất kỳ' },
+        { name: 'outScrollTop', type: 'Event', description: 'Bắn ra khi scroll đến top' },
+        { name: 'outScrollBottom', type: 'Event', description: 'Bắn ra khi scroll đến bottom' }
+    ];
+    optionsDoc = [
+        { name: 'scrollbarWidth', type: 'number', default: 'undefined', description: 'Chiều rộng scrollbar (px)' },
+        { name: 'scrollbarColor', type: 'string', default: 'undefined', description: 'Màu track scrollbar' },
+        { name: 'scrollbarHoverColor', type: 'string', default: 'undefined', description: 'Màu track khi hover' },
+        { name: 'scrollThumbColor', type: 'string', default: 'undefined', description: 'Màu thumb' },
+        { name: 'scrollThumbHoverColor', type: 'string', default: 'undefined', description: 'Màu thumb khi hover' },
+        { name: 'scrollbarPadding', type: 'number', default: 'undefined', description: 'Padding scrollbar' },
+        { name: 'scrollX', type: `'hidden' | 'scroll'`, default: 'undefined', description: 'Kiểu scroll X' },
+        { name: 'scrollXOpacity0', type: 'boolean', default: 'undefined', description: 'Ẩn track X khi không hover' },
+        { name: 'scrollY', type: `'hidden' | 'scroll'`, default: 'undefined', description: 'Kiểu scroll Y' },
+        { name: 'scrollYOpacity0', type: 'boolean', default: 'undefined', description: 'Ẩn track Y khi không hover' }
+    ];
+    interfacesDoc = [
+        { name: 'IScrollOverlayOptions', type: 'interface', description: 'Các tuỳ chọn cấu hình scroll-overlay' }
+    ];
+    // Installation commands
+    installCommandNpm = 'npm install @libs-ui/components-scroll-overlay';
+    installCommandYarn = 'yarn add @libs-ui/components-scroll-overlay';
+    copyToClipboard(text) {
+        navigator.clipboard.writeText(text).then(() => console.log('Copied:', text));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsScrollOverlayDemoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: LibsUiComponentsScrollOverlayDemoComponent, isStandalone: true, selector: "lib-scroll-overlay-demo", ngImport: i0, template: "<div class=\"max-w-6xl mx-auto p-5 font-sans text-gray-800\">\n  <header class=\"text-center py-10 bg-white rounded-lg mb-8 shadow-sm\">\n    <h1 class=\"text-4xl font-bold mb-2\">Demo Scroll Overlay</h1>\n    <p class=\"text-xl text-gray-500\">&#64;libs-ui/components-scroll-overlay</p>\n  </header>\n\n  <main>\n    <!-- Gi\u1EDBi thi\u1EC7u -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Gi\u1EDBi thi\u1EC7u</h2>\n      <p><code>scroll-overlay</code> l\u00E0 m\u1ED9t directive gi\u00FAp tu\u1EF3 bi\u1EBFn scrollbar tr\u00EAn b\u1EA5t k\u1EF3 ph\u1EA7n t\u1EED n\u00E0o trong Angular, h\u1ED7 tr\u1EE3 tu\u1EF3 ch\u1EC9nh m\u00E0u, k\u00EDch th\u01B0\u1EDBc, \u1EA9n/hi\u1EC7n v\u00E0 s\u1EF1 ki\u1EC7n scroll.</p>\n    </section>\n\n    <!-- C\u00E0i \u0111\u1EB7t -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">C\u00E0i \u0111\u1EB7t</h2>\n      <div class=\"flex items-center bg-gray-100 p-4 rounded-lg mb-4\">\n        <pre class=\"flex-1 text-sm overflow-x-auto\"><code>{{ installCommandNpm }}</code></pre>\n        <button class=\"ml-4 px-3 py-1 bg-blue-500 text-white rounded hover:bg-blue-600\" (click)=\"copyToClipboard(installCommandNpm)\">Sao ch\u00E9p</button>\n      </div>\n      <div class=\"flex items-center bg-gray-100 p-4 rounded-lg\">\n        <pre class=\"flex-1 text-sm overflow-x-auto\"><code>{{ installCommandYarn }}</code></pre>\n        <button class=\"ml-4 px-3 py-1 bg-blue-500 text-white rounded hover:bg-blue-600\" (click)=\"copyToClipboard(installCommandYarn)\">Sao ch\u00E9p</button>\n      </div>\n    </section>\n\n    <!-- Demo Tr\u1EF1c ti\u1EBFp -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Demo Tr\u1EF1c ti\u1EBFp</h2>\n      <div class=\"grid grid-cols-4 gap-4 mb-6\">\n        <button *ngFor=\"let sc of scenarioOptions\"\n          (click)=\"selectedScenario = sc\"\n          class=\"px-3 py-1 border rounded\"\n          [class.bg-blue-500]=\"selectedScenario===sc\"\n          [class.text-white]=\"selectedScenario===sc\">\n          {{ sc }}\n        </button>\n      </div>\n      <div class=\"p-4 bg-gray-50 rounded-lg h-[300px]\">\n        <div LibsUiComponentsScrollOverlayDirective\n             [options]=\"options\"\n             (outScroll)=\"onScroll()\"\n             (outScrollTop)=\"onScrollTop()\"\n             (outScrollBottom)=\"onScrollBottom()\"\n             class=\"w-full h-full\">\n          <div class=\"p-2\"\n               [innerText]=\"content\"\n               [class.whitespace-pre-wrap]=\"selectedScenario!=='horizontal'\"\n               [class.whitespace-nowrap]=\"selectedScenario==='horizontal'\"></div>\n        </div>\n      </div>\n      <p class=\"mt-4 text-gray-700\">S\u1EF1 ki\u1EC7n: {{ lastEvent() }}</p>\n    </section>\n\n    <!-- C\u00E1ch s\u1EED d\u1EE5ng -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">C\u00E1ch s\u1EED d\u1EE5ng</h2>\n      <pre class=\"bg-gray-100 p-4 rounded-lg overflow-auto text-sm\">\n        <code ngNonBindable>&lt;div LibsUiComponentsScrollOverlayDirective [options]=\"&#123; scrollbarWidth:12, scrollThumbColor:'#3b82f6' &#125;\" style=\"width:300px;height:200px;overflow:auto;\"&gt;\n  N\u1ED9i dung d\u00E0i...\n&lt;/div&gt;</code>\n      </pre>\n    </section>\n\n    <!-- API Reference -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">API Reference</h2>\n      <h3 class=\"text-xl font-semibold mb-3\">Inputs</h3>\n      <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n        <thead>\n          <tr>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">T\u00EAn</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Ki\u1EC3u</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u1EB7c \u0111\u1ECBnh</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u00F4 t\u1EA3</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let input of inputsDoc\">\n            <td class=\"py-2 px-4 border-b\"><code>{{ input.name }}</code></td>\n            <td class=\"py-2 px-4 border-b\"><code>{{ input.type }}</code></td>\n            <td class=\"py-2 px-4 border-b\">{{ input.default }}</td>\n            <td class=\"py-2 px-4 border-b\">{{ input.description }}</td>\n          </tr>\n        </tbody>\n      </table>\n      <h3 class=\"text-xl font-semibold mb-3\">Outputs</h3>\n      <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n        <thead>\n          <tr>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">T\u00EAn</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Ki\u1EC3u</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u00F4 t\u1EA3</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let output of outputsDoc\">\n            <td class=\"py-2 px-4 border-b\"><code>{{ output.name }}</code></td>\n            <td class=\"py-2 px-4 border-b\"><code>{{ output.type }}</code></td>\n            <td class=\"py-2 px-4 border-b\">{{ output.description }}</td>\n          </tr>\n        </tbody>\n      </table>\n      <h3 class=\"text-xl font-semibold mb-3\">Options</h3>\n      <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n        <thead>\n          <tr>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Thu\u1ED9c t\u00EDnh</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Ki\u1EC3u</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u1EB7c \u0111\u1ECBnh</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u00F4 t\u1EA3</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let opt of optionsDoc\">\n            <td class=\"py-2 px-4 border-b\"><code>{{ opt.name }}</code></td>\n            <td class=\"py-2 px-4 border-b\"><code>{{ opt.type }}</code></td>\n            <td class=\"py-2 px-4 border-b\">{{ opt.default }}</td>\n            <td class=\"py-2 px-4 border-b\">{{ opt.description }}</td>\n          </tr>\n        </tbody>\n      </table>\n      <h3 class=\"text-xl font-semibold mb-3\">Interfaces</h3>\n      <div class=\"space-y-6\">\n        <div *ngFor=\"let intf of interfacesDoc\" class=\"bg-gray-50 p-6 rounded-lg\">\n          <h4 class=\"font-semibold mb-2\">{{ intf.name }}</h4>\n          <pre class=\"bg-gray-100 p-4 rounded-lg overflow-auto text-sm mb-3\"><code>{{ intf.type }}</code></pre>\n          <p>{{ intf.description }}</p>\n        </div>\n      </div>\n    </section>\n  </main>\n</div>\n", styles: ["@charset \"UTF-8\";.demo-container{padding:24px;font-family:system-ui,-apple-system,sans-serif;max-width:1200px;margin:0 auto}.demo-intro{margin-bottom:32px}.demo-intro h3{color:#333;margin-bottom:16px}.demo-intro ul{list-style:none;padding:0}.demo-intro ul li{margin-bottom:8px;padding-left:20px;position:relative}.demo-intro ul li:before{content:\"\\2022\";position:absolute;left:0;color:#3b82f6}.demo-features{margin-bottom:32px}.demo-features h3{color:#333;margin-bottom:16px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.feature-item{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0}.feature-item h4{color:#1e40af;margin:0 0 8px}.feature-item p{margin:0;color:#64748b}.demo-api{margin-bottom:48px}.demo-api h3{color:#333;margin-bottom:24px}.api-section{margin-bottom:32px}.api-section h4{color:#1e40af;margin-bottom:16px}.api-table{overflow-x:auto}.api-table table{width:100%;border-collapse:collapse;background:#fff;border-radius:8px;border:1px solid #e2e8f0}.api-table table th,.api-table table td{padding:12px 16px;text-align:left;border-bottom:1px solid #e2e8f0}.api-table table th{background:#f8fafc;font-weight:600;color:#1e40af}.api-table table td{color:#64748b}.api-table table td:first-child{font-family:Fira Code,monospace;color:#334155}.api-table table td:nth-child(2){font-family:Fira Code,monospace;color:#3b82f6}.api-table table tr:last-child td{border-bottom:none}.demo-section{margin-bottom:48px}.demo-section h3{color:#333;margin-bottom:16px}.demo-description{margin-bottom:16px}.demo-description p{color:#64748b;margin-bottom:12px}.demo-description pre{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0;overflow-x:auto}.demo-description pre code{font-family:Fira Code,monospace;font-size:14px;color:#334155}.demo-box{display:flex;gap:16px;align-items:flex-start}.event-log{padding:16px;background:#f5f5f5;border-radius:4px;min-width:200px}.event-log p{margin:0;font-size:14px;color:#666}.demo-notes{margin-top:48px;padding:24px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0}.demo-notes h3{color:#333;margin-bottom:16px}.demo-notes ul{list-style:none;padding:0;margin:0}.demo-notes ul li{color:#64748b;margin-bottom:12px;padding-left:24px;position:relative}.demo-notes ul li:before{content:\"\\2192\";position:absolute;left:0;color:#3b82f6}.demo-notes ul li:last-child{margin-bottom:0}.interface-description{margin-bottom:24px}.interface-description p{color:#64748b;margin-bottom:16px}.interface-description pre{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0;overflow-x:auto}.interface-description pre code{font-family:Fira Code,monospace;font-size:14px;color:#334155;line-height:1.6}.interface-usage{margin-bottom:24px}.interface-usage h5{color:#1e40af;margin-bottom:12px;font-size:16px}.interface-usage pre{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0;overflow-x:auto}.interface-usage pre code{font-family:Fira Code,monospace;font-size:14px;color:#334155;line-height:1.6}.interface-usage pre code .comment{color:#64748b}.interface-notes{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0}.interface-notes h5{color:#1e40af;margin-bottom:12px;font-size:16px}.interface-notes ul{list-style:none;padding:0;margin:0}.interface-notes ul li{color:#64748b;margin-bottom:8px;padding-left:20px;position:relative}.interface-notes ul li:before{content:\"\\2022\";position:absolute;left:0;color:#3b82f6}.interface-notes ul li:last-child{margin-bottom:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsScrollOverlayDemoComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-scroll-overlay-demo', standalone: true, imports: [CommonModule, LibsUiComponentsScrollOverlayDirective], template: "<div class=\"max-w-6xl mx-auto p-5 font-sans text-gray-800\">\n  <header class=\"text-center py-10 bg-white rounded-lg mb-8 shadow-sm\">\n    <h1 class=\"text-4xl font-bold mb-2\">Demo Scroll Overlay</h1>\n    <p class=\"text-xl text-gray-500\">&#64;libs-ui/components-scroll-overlay</p>\n  </header>\n\n  <main>\n    <!-- Gi\u1EDBi thi\u1EC7u -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Gi\u1EDBi thi\u1EC7u</h2>\n      <p><code>scroll-overlay</code> l\u00E0 m\u1ED9t directive gi\u00FAp tu\u1EF3 bi\u1EBFn scrollbar tr\u00EAn b\u1EA5t k\u1EF3 ph\u1EA7n t\u1EED n\u00E0o trong Angular, h\u1ED7 tr\u1EE3 tu\u1EF3 ch\u1EC9nh m\u00E0u, k\u00EDch th\u01B0\u1EDBc, \u1EA9n/hi\u1EC7n v\u00E0 s\u1EF1 ki\u1EC7n scroll.</p>\n    </section>\n\n    <!-- C\u00E0i \u0111\u1EB7t -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">C\u00E0i \u0111\u1EB7t</h2>\n      <div class=\"flex items-center bg-gray-100 p-4 rounded-lg mb-4\">\n        <pre class=\"flex-1 text-sm overflow-x-auto\"><code>{{ installCommandNpm }}</code></pre>\n        <button class=\"ml-4 px-3 py-1 bg-blue-500 text-white rounded hover:bg-blue-600\" (click)=\"copyToClipboard(installCommandNpm)\">Sao ch\u00E9p</button>\n      </div>\n      <div class=\"flex items-center bg-gray-100 p-4 rounded-lg\">\n        <pre class=\"flex-1 text-sm overflow-x-auto\"><code>{{ installCommandYarn }}</code></pre>\n        <button class=\"ml-4 px-3 py-1 bg-blue-500 text-white rounded hover:bg-blue-600\" (click)=\"copyToClipboard(installCommandYarn)\">Sao ch\u00E9p</button>\n      </div>\n    </section>\n\n    <!-- Demo Tr\u1EF1c ti\u1EBFp -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Demo Tr\u1EF1c ti\u1EBFp</h2>\n      <div class=\"grid grid-cols-4 gap-4 mb-6\">\n        <button *ngFor=\"let sc of scenarioOptions\"\n          (click)=\"selectedScenario = sc\"\n          class=\"px-3 py-1 border rounded\"\n          [class.bg-blue-500]=\"selectedScenario===sc\"\n          [class.text-white]=\"selectedScenario===sc\">\n          {{ sc }}\n        </button>\n      </div>\n      <div class=\"p-4 bg-gray-50 rounded-lg h-[300px]\">\n        <div LibsUiComponentsScrollOverlayDirective\n             [options]=\"options\"\n             (outScroll)=\"onScroll()\"\n             (outScrollTop)=\"onScrollTop()\"\n             (outScrollBottom)=\"onScrollBottom()\"\n             class=\"w-full h-full\">\n          <div class=\"p-2\"\n               [innerText]=\"content\"\n               [class.whitespace-pre-wrap]=\"selectedScenario!=='horizontal'\"\n               [class.whitespace-nowrap]=\"selectedScenario==='horizontal'\"></div>\n        </div>\n      </div>\n      <p class=\"mt-4 text-gray-700\">S\u1EF1 ki\u1EC7n: {{ lastEvent() }}</p>\n    </section>\n\n    <!-- C\u00E1ch s\u1EED d\u1EE5ng -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">C\u00E1ch s\u1EED d\u1EE5ng</h2>\n      <pre class=\"bg-gray-100 p-4 rounded-lg overflow-auto text-sm\">\n        <code ngNonBindable>&lt;div LibsUiComponentsScrollOverlayDirective [options]=\"&#123; scrollbarWidth:12, scrollThumbColor:'#3b82f6' &#125;\" style=\"width:300px;height:200px;overflow:auto;\"&gt;\n  N\u1ED9i dung d\u00E0i...\n&lt;/div&gt;</code>\n      </pre>\n    </section>\n\n    <!-- API Reference -->\n    <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n      <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">API Reference</h2>\n      <h3 class=\"text-xl font-semibold mb-3\">Inputs</h3>\n      <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n        <thead>\n          <tr>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">T\u00EAn</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Ki\u1EC3u</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u1EB7c \u0111\u1ECBnh</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u00F4 t\u1EA3</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let input of inputsDoc\">\n            <td class=\"py-2 px-4 border-b\"><code>{{ input.name }}</code></td>\n            <td class=\"py-2 px-4 border-b\"><code>{{ input.type }}</code></td>\n            <td class=\"py-2 px-4 border-b\">{{ input.default }}</td>\n            <td class=\"py-2 px-4 border-b\">{{ input.description }}</td>\n          </tr>\n        </tbody>\n      </table>\n      <h3 class=\"text-xl font-semibold mb-3\">Outputs</h3>\n      <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n        <thead>\n          <tr>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">T\u00EAn</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Ki\u1EC3u</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u00F4 t\u1EA3</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let output of outputsDoc\">\n            <td class=\"py-2 px-4 border-b\"><code>{{ output.name }}</code></td>\n            <td class=\"py-2 px-4 border-b\"><code>{{ output.type }}</code></td>\n            <td class=\"py-2 px-4 border-b\">{{ output.description }}</td>\n          </tr>\n        </tbody>\n      </table>\n      <h3 class=\"text-xl font-semibold mb-3\">Options</h3>\n      <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n        <thead>\n          <tr>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Thu\u1ED9c t\u00EDnh</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">Ki\u1EC3u</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u1EB7c \u0111\u1ECBnh</th>\n            <th class=\"py-2 px-4 border-b bg-gray-100\">M\u00F4 t\u1EA3</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let opt of optionsDoc\">\n            <td class=\"py-2 px-4 border-b\"><code>{{ opt.name }}</code></td>\n            <td class=\"py-2 px-4 border-b\"><code>{{ opt.type }}</code></td>\n            <td class=\"py-2 px-4 border-b\">{{ opt.default }}</td>\n            <td class=\"py-2 px-4 border-b\">{{ opt.description }}</td>\n          </tr>\n        </tbody>\n      </table>\n      <h3 class=\"text-xl font-semibold mb-3\">Interfaces</h3>\n      <div class=\"space-y-6\">\n        <div *ngFor=\"let intf of interfacesDoc\" class=\"bg-gray-50 p-6 rounded-lg\">\n          <h4 class=\"font-semibold mb-2\">{{ intf.name }}</h4>\n          <pre class=\"bg-gray-100 p-4 rounded-lg overflow-auto text-sm mb-3\"><code>{{ intf.type }}</code></pre>\n          <p>{{ intf.description }}</p>\n        </div>\n      </div>\n    </section>\n  </main>\n</div>\n", styles: ["@charset \"UTF-8\";.demo-container{padding:24px;font-family:system-ui,-apple-system,sans-serif;max-width:1200px;margin:0 auto}.demo-intro{margin-bottom:32px}.demo-intro h3{color:#333;margin-bottom:16px}.demo-intro ul{list-style:none;padding:0}.demo-intro ul li{margin-bottom:8px;padding-left:20px;position:relative}.demo-intro ul li:before{content:\"\\2022\";position:absolute;left:0;color:#3b82f6}.demo-features{margin-bottom:32px}.demo-features h3{color:#333;margin-bottom:16px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.feature-item{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0}.feature-item h4{color:#1e40af;margin:0 0 8px}.feature-item p{margin:0;color:#64748b}.demo-api{margin-bottom:48px}.demo-api h3{color:#333;margin-bottom:24px}.api-section{margin-bottom:32px}.api-section h4{color:#1e40af;margin-bottom:16px}.api-table{overflow-x:auto}.api-table table{width:100%;border-collapse:collapse;background:#fff;border-radius:8px;border:1px solid #e2e8f0}.api-table table th,.api-table table td{padding:12px 16px;text-align:left;border-bottom:1px solid #e2e8f0}.api-table table th{background:#f8fafc;font-weight:600;color:#1e40af}.api-table table td{color:#64748b}.api-table table td:first-child{font-family:Fira Code,monospace;color:#334155}.api-table table td:nth-child(2){font-family:Fira Code,monospace;color:#3b82f6}.api-table table tr:last-child td{border-bottom:none}.demo-section{margin-bottom:48px}.demo-section h3{color:#333;margin-bottom:16px}.demo-description{margin-bottom:16px}.demo-description p{color:#64748b;margin-bottom:12px}.demo-description pre{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0;overflow-x:auto}.demo-description pre code{font-family:Fira Code,monospace;font-size:14px;color:#334155}.demo-box{display:flex;gap:16px;align-items:flex-start}.event-log{padding:16px;background:#f5f5f5;border-radius:4px;min-width:200px}.event-log p{margin:0;font-size:14px;color:#666}.demo-notes{margin-top:48px;padding:24px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0}.demo-notes h3{color:#333;margin-bottom:16px}.demo-notes ul{list-style:none;padding:0;margin:0}.demo-notes ul li{color:#64748b;margin-bottom:12px;padding-left:24px;position:relative}.demo-notes ul li:before{content:\"\\2192\";position:absolute;left:0;color:#3b82f6}.demo-notes ul li:last-child{margin-bottom:0}.interface-description{margin-bottom:24px}.interface-description p{color:#64748b;margin-bottom:16px}.interface-description pre{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0;overflow-x:auto}.interface-description pre code{font-family:Fira Code,monospace;font-size:14px;color:#334155;line-height:1.6}.interface-usage{margin-bottom:24px}.interface-usage h5{color:#1e40af;margin-bottom:12px;font-size:16px}.interface-usage pre{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0;overflow-x:auto}.interface-usage pre code{font-family:Fira Code,monospace;font-size:14px;color:#334155;line-height:1.6}.interface-usage pre code .comment{color:#64748b}.interface-notes{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0}.interface-notes h5{color:#1e40af;margin-bottom:12px;font-size:16px}.interface-notes ul{list-style:none;padding:0;margin:0}.interface-notes ul li{color:#64748b;margin-bottom:8px;padding-left:20px;position:relative}.interface-notes ul li:before{content:\"\\2022\";position:absolute;left:0;color:#3b82f6}.interface-notes ul li:last-child{margin-bottom:0}\n"] }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsLW92ZXJsYXkuZGVtby5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9zY3JvbGwtb3ZlcmxheS9zcmMvZGVtby9zY3JvbGwtb3ZlcmxheS5kZW1vLnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL3Njcm9sbC1vdmVybGF5L3NyYy9kZW1vL3Njcm9sbC1vdmVybGF5LmRlbW8uaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbEQsT0FBTyxFQUFFLHNDQUFzQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7OztBQVVyRixNQUFNLE9BQU8sMENBQTBDO0lBQ3JELGdFQUFnRTtJQUNoRSxXQUFXLEdBQUcsTUFBTSxDQUNsQixLQUFLLENBQUMsSUFBSSxDQUFDLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxFQUFFLENBQUMsQ0FBQyxFQUFFLENBQUMsRUFBRSxFQUFFLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQ2xFLENBQUM7SUFDRix3RUFBd0U7SUFDeEUscUJBQXFCLEdBQUcsTUFBTSxDQUM1QixLQUFLLENBQUMsSUFBSSxDQUFDLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxFQUFFLENBQUMsQ0FBQyxFQUFFLENBQUMsRUFBRSxFQUFFLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQ2pFLENBQUM7SUFFRixxQkFBcUI7SUFDckIsZUFBZSxHQUFHLENBQUMsU0FBUyxFQUFFLGFBQWEsRUFBRSxVQUFVLEVBQUUsWUFBWSxDQUFVLENBQUM7SUFDaEYs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QUFxQixFQUFlLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLGVBQWUsRUFBRTtRQUMvSCxFQUFFLElBQUksRUFBRSxpQkFBaUIsRUFBUSxJQUFJLEVBQUUsU0FBUyxFQUEwQixPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsRUFBRSw0QkFBNEIsRUFBRTtLQUM1SSxDQUFDO0lBQ0YsYUFBYSxHQUFHO1FBQ2QsRUFBRSxJQUFJLEVBQUUsdUJBQXVCLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQUUsc0NBQXNDLEVBQUU7S0FDMUcsQ0FBQztJQUVGLHdCQUF3QjtJQUN4QixpQkFBaUIsR0FBRyxnREFBZ0QsQ0FBQztJQUNyRSxrQkFBa0IsR0FBRyw2Q0FBNkMsQ0FBQztJQUVuRSxlQUFlLENBQUMsSUFBWTtRQUMxQixTQUFTLENBQUMsU0FBUyxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxTQUFTLEVBQUUsSUFBSSxDQUFDLENBQUMsQ0FBQztJQUMvRSxDQUFDO3dHQTdFVSwwQ0FBMEM7NEZBQTFDLDBDQUEwQyxtRkNadkQseXZOQXFJQSxxaUhEN0hZLFlBQVksNEpBQUUsc0NBQXNDOzs0RkFJbkQsMENBQTBDO2tCQVB0RCxTQUFTOytCQUNFLHlCQUF5QixjQUN2QixJQUFJLFdBQ1AsQ0FBQyxZQUFZLEVBQUUsc0NBQXNDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBzaWduYWwgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IExpYnNVaUNvbXBvbmVudHNTY3JvbGxPdmVybGF5RGlyZWN0aXZlIH0gZnJvbSAnLi4vc2Nyb2xsLW92ZXJsYXkuZGlyZWN0aXZlJztcbmltcG9ydCB7IElTY3JvbGxPdmVybGF5T3B0aW9ucyB9IGZyb20gJy4uL3Njcm9sbC5pbnRlcmZhY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdsaWItc2Nyb2xsLW92ZXJsYXktZGVtbycsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIExpYnNVaUNvbXBvbmVudHNTY3JvbGxPdmVybGF5RGlyZWN0aXZlXSxcbiAgdGVtcGxhdGVVcmw6ICcuL3Njcm9sbC1vdmVybGF5LmRlbW8uaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3Njcm9sbC1vdmVybGF5LmRlbW8uc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIExpYnNVaUNvbXBvbmVudHNTY3JvbGxPdmVybGF5RGVtb0NvbXBvbmVudCB7XG4gIC8vIERlbW8gdGV4dCBjb250ZW50OiBnZW5lcmF0ZSA1MDAwIHdvcmRzIGZvciB2ZXJ0aWNhbCBzY3JvbGxpbmdcbiAgbG9uZ0NvbnRlbnQgPSBzaWduYWwoXG4gICAgQXJyYXkuZnJvbSh7IGxlbmd0aDogNTAwMCB9LCAoXywgaSkgPT4gYExvcmVtJHtpICsgMX1gKS5qb2luKCcgJylcbiAgKTtcbiAgLy8gRGVtbyBob3Jpem9udGFsIGNvbnRlbnQ6IGdlbmVyYXRlIDUwMDAgd29yZHMgZm9yIGhvcml6b250YWwgc2Nyb2xsaW5nXG4gIGxvbmdIb3Jpem9udGFsQ29udGVudCA9IHNpZ25hbChcbiAgICBBcnJheS5mcm9tKHsgbGVuZ3RoOiA1MDAwIH0sIChfLCBpKSA9PiBgV29yZCR7aSArIDF9YCkuam9pbignICcpXG4gICk7XG5cbiAgLy8gU2NlbmFyaW8gc2VsZWN0aW9uXG4gIHNjZW5hcmlvT3B0aW9ucyA9IFsnZGVmYXVsdCcsICdjdXN0b21TdHlsZScsICdhdXRvSGlkZScsICdob3Jpem9udGFsJ10gYXMgY29uc3Q7XG4gIHNlbGVjdGVkU2NlbmFyaW86IHR5cGVvZiB0aGlzLnNjZW5hcmlvT3B0aW9uc1tudW1iZXJdID0gJ2RlZmF1bHQnO1xuXG4gIC8vIE9wdGlvbnMgc2lnbmFsc1xuICBjdXN0b21TdHlsZU9wdGlvbnMgPSBzaWduYWw8SVNjcm9sbE92ZXJsYXlPcHRpb25zPih7IHNjcm9sbGJhcldpZHRoOiAxMiwgc2Nyb2xsYmFyQ29sb3I6ICcjZjNmNGY2Jywgc2Nyb2xsYmFySG92ZXJDb2xvcjogJyNlNWU3ZWInLCBzY3JvbGxUaHVtYkNvbG9yOiAnIzNiODJmNicsIHNjcm9sbFRodW1iSG92ZXJDb2xvcjogJyMyNTYzZWInLCBzY3JvbGxiYXJQYWRkaW5nOiA0IH0pO1xuICBhdXRvSGlkZU9wdGlvbnMgPSBzaWduYWw8SVNjcm9sbE92ZXJsYXlPcHRpb25zPih7IHNjcm9sbFlPcGFjaXR5MDogdHJ1ZSwgc2Nyb2xsYmFyV2lkdGg6IDgsIHNjcm9sbGJhckNvbG9yOiAndHJhbnNwYXJlbnQnLCBzY3JvbGxUaHVtYkNvbG9yOiAnIzljYTNhZicsIHNjcm9sbFRodW1iSG92ZXJDb2xvcjogJyM2YjcyODAnIH0pO1xuICBob3Jpem9udGFsT3B0aW9ucyAgID0gc2lnbmFsPElTY3JvbGxPdmVybGF5T3B0aW9ucz4oeyBzY3JvbGxYOiAnc2Nyb2xsJywgc2Nyb2xsWTogJ2hpZGRlbicsIHNjcm9sbGJhcldpZHRoOiA4LCBzY3JvbGxiYXJDb2xvcjogJyNmM2Y0ZjYnLCBzY3JvbGxUaHVtYkNvbG9yOiAnIzNiODJmNicgfSk7XG5cbiAgLy8gU2Nyb2xsIGV2ZW50IGxvZ1xuICBsYXN0RXZlbnQgPSBzaWduYWw8c3RyaW5nPignTm8gZXZlbnRzIHlldCcpO1xuXG4gIC8vIEhlbHBlcnNcbiAgZ2V0IG9wdGlvbnMoKTogSVNjcm9sbE92ZXJsYXlPcHRpb25zIHwgdW5kZWZpbmVkIHtcbiAgICBzd2l0Y2ggKHRoaXMuc2VsZWN0ZWRTY2VuYXJpbykge1xuICAgICAgY2FzZSAnY3VzdG9tU3R5bGUnOiByZXR1cm4gdGhpcy5jdXN0b21TdHlsZU9wdGlvbnMoKTtcbiAgICAgIGNhc2UgJ2F1dG9IaWRlJzogICAgcmV0dXJuIHRoaXMuYXV0b0hpZGVPcHRpb25zKCk7XG4gICAgICBjYXNlICdob3Jpem9udGFsJzogIHJldHVybiB0aGlzLmhvcml6b250YWxPcHRpb25zKCk7XG4gICAgICBkZWZhdWx0OiAgICAgICAgICAgIHJldHVybiB1bmRlZmluZWQ7XG4gICAgfVxuICB9XG5cbiAgZ2V0IGNvbnRlbnQoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5zZWxlY3RlZFNjZW5hcmlvID09PSAnaG9yaXpvbnRhbCdcbiAgICAgID8gdGhpcy5sb25nSG9yaXpvbnRhbENvbnRlbnQoKVxuICAgICAgOiB0aGlzLmxvbmdDb250ZW50KCk7XG4gIH1cblxuICAvLyBFdmVudCBoYW5kbGVyc1xuICBvblNjcm9sbCgpICAgICAgIHsgdGhpcy5sYXN0RXZlbnQuc2V0KCdTY3JvbGwgZXZlbnQgZmlyZWQnKTsgfVxuICBvblNjcm9sbFRvcCgpICAgIHsgdGhpcy5sYXN0RXZlbnQuc2V0KCdSZWFjaGVkIHRvcCcpOyB9XG4gIG9uU2Nyb2xsQm90dG9tKCkgeyB0aGlzLmxhc3RFdmVudC5zZXQoJ1JlYWNoZWQgYm90dG9tJyk7IH1cblxuICAvLyBBUEkgZG9jc1xuICBpbnB1dHNEb2MgPSBbXG4gICAgeyBuYW1lOiAnb3B0aW9ucycsICAgICAgICAgICAgICAgdHlwZTogJ0lTY3JvbGxPdmVybGF5T3B0aW9ucycsIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ0PhuqV1IGjDrG5oIHR14buzIGNo4buJbmggc2Nyb2xsYmFyJyB9LFxuICAgIHsgbmFtZTogJ2RlYnVnTW9kZScsICAgICAgICAgICAgIHR5cGU6ICdib29sZWFuJywgICAgICAgICAgICAgIGRlZmF1bHQ6ICdmYWxzZScsICAgICAgZGVzY3JpcHRpb246ICdC4bqtdCBjaOG6vyDEkeG7mSBkZWJ1ZycgfSxcbiAgICB7IG5hbWU6ICdub3RTaG93U2Nyb2xsQmFyWCcsICAgICB0eXBlOiAnYm9vbGVhbicsICAgICAgICAgICAgICBkZWZhdWx0OiAnZmFsc2UnLCAgICAgIGRlc2NyaXB0aW9uOiAn4bqobiBzY3JvbGxiYXIgbmdhbmcnIH0sXG4gICAgeyBuYW1lOiAnbm90U2hvd1Njcm9sbEJhclknLCAgICAgdHlwZTogJ2Jvb2xlYW4nLCAgICAgICAgICAgICAgZGVmYXVsdDogJ2ZhbHNlJywgICAgICBkZXNjcmlwdGlvbjogJ+G6qG4gc2Nyb2xsYmFyIGThu41jJyB9XG4gIF07XG4gIG91dHB1dHNEb2MgPSBbXG4gICAgeyBuYW1lOiAnb3V0U2Nyb2xsJywgICAgICAgdHlwZTogJ0V2ZW50JywgZGVzY3JpcHRpb246ICdC4bqvbiByYSBraGkgc2Nyb2xsIGLhuqV0IGvhu7MnIH0sXG4gICAgeyBuYW1lOiAnb3V0U2Nyb2xsVG9wJywgICAgdHlwZTogJ0V2ZW50JywgZGVzY3JpcHRpb246ICdC4bqvbiByYSBraGkgc2Nyb2xsIMSR4bq/biB0b3AnIH0sXG4gICAgeyBuYW1lOiAnb3V0U2Nyb2xsQm90dG9tJywgdHlwZTogJ0V2ZW50JywgZGVzY3JpcHRpb246ICdC4bqvbiByYSBraGkgc2Nyb2xsIMSR4bq/biBib3R0b20nIH1cbiAgXTtcbiAgb3B0aW9uc0RvYyA9IFtcbiAgICB7IG5hbWU6ICdzY3JvbGxiYXJXaWR0aCcsICAgICAgICB0eXBlOiAnbnVtYmVyJywgICAgICAgICAgICAgICAgICAgICAgICAgIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ0NoaeG7gXUgcuG7mW5nIHNjcm9sbGJhciAocHgpJyB9LFxuICAgIHsgbmFtZTogJ3Njcm9sbGJhckNvbG9yJywgICAgICAgIHR5cGU6ICdzdHJpbmcnLCAgICAgICAgICAgICAgICAgICAgICAgICAgZGVmYXVsdDogJ3VuZGVmaW5lZCcsIGRlc2NyaXB0aW9uOiAnTcOgdSB0cmFjayBzY3JvbGxiYXInIH0sXG4gICAgeyBuYW1lOiAnc2Nyb2xsYmFySG92ZXJDb2xvcicsICAgdHlwZTogJ3N0cmluZycsICAgICAgICAgICAgICAgICAgICAgICAgICBkZWZhdWx0OiAndW5kZWZpbmVkJywgZGVzY3JpcHRpb246ICdNw6B1IHRyYWNrIGtoaSBob3ZlcicgfSxcbiAgICB7IG5hbWU6ICdzY3JvbGxUaHVtYkNvbG9yJywgICAgICB0eXBlOiAnc3RyaW5nJywgICAgICAgICAgICAgICAgICAgICAgICAgIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ03DoHUgdGh1bWInIH0sXG4gICAgeyBuYW1lOiAnc2Nyb2xsVGh1bWJIb3ZlckNvbG9yJywgdHlwZTogJ3N0cmluZycsICAgICAgICAgICAgICAgICAgICAgICAgICBkZWZhdWx0OiAndW5kZWZpbmVkJywgZGVzY3JpcHRpb246ICdNw6B1IHRodW1iIGtoaSBob3ZlcicgfSxcbiAgICB7IG5hbWU6ICdzY3JvbGxiYXJQYWRkaW5nJywgICAgICB0eXBlOiAnbnVtYmVyJywgICAgICAgICAgICAgICAgICAgICAgICAgIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ1BhZGRpbmcgc2Nyb2xsYmFyJyB9LFxuICAgIHsgbmFtZTogJ3Njcm9sbFgnLCAgICAgICAgICAgICAgIHR5cGU6IGAnaGlkZGVuJyB8ICdzY3JvbGwnYCwgICAgICAgICAgICAgIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ0tp4buDdSBzY3JvbGwgWCcgfSxcbiAgICB7IG5hbWU6ICdzY3JvbGxYT3BhY2l0eTAnLCAgICAgICB0eXBlOiAnYm9vbGVhbicsICAgICAgICAgICAgICAgICAgICAgICAgIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ+G6qG4gdHJhY2sgWCBraGkga2jDtG5nIGhvdmVyJyB9LFxuICAgIHsgbmFtZTogJ3Njcm9sbFknLCAgICAgICAgICAgICAgIHR5cGU6IGAnaGlkZGVuJyB8ICdzY3JvbGwnYCwgICAgICAgICAgICAgIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ0tp4buDdSBzY3JvbGwgWScgfSxcbiAgICB7IG5hbWU6ICdzY3JvbGxZT3BhY2l0eTAnLCAgICAgICB0eXBlOiAnYm9vbGVhbicsICAgICAgICAgICAgICAgICAgICAgICAgIGRlZmF1bHQ6ICd1bmRlZmluZWQnLCBkZXNjcmlwdGlvbjogJ+G6qG4gdHJhY2sgWSBraGkga2jDtG5nIGhvdmVyJyB9XG4gIF07XG4gIGludGVyZmFjZXNEb2MgPSBbXG4gICAgeyBuYW1lOiAnSVNjcm9sbE92ZXJsYXlPcHRpb25zJywgdHlwZTogJ2ludGVyZmFjZScsIGRlc2NyaXB0aW9uOiAnQ8OhYyB0deG7syBjaOG7jW4gY+G6pXUgaMOsbmggc2Nyb2xsLW92ZXJsYXknIH1cbiAgXTtcblxuICAvLyBJbnN0YWxsYXRpb24gY29tbWFuZHNcbiAgaW5zdGFsbENvbW1hbmROcG0gPSAnbnBtIGluc3RhbGwgQGxpYnMtdWkvY29tcG9uZW50cy1zY3JvbGwtb3ZlcmxheSc7XG4gIGluc3RhbGxDb21tYW5kWWFybiA9ICd5YXJuIGFkZCBAbGlicy11aS9jb21wb25lbnRzLXNjcm9sbC1vdmVybGF5JztcblxuICBjb3B5VG9DbGlwYm9hcmQodGV4dDogc3RyaW5nKSB7XG4gICAgbmF2aWdhdG9yLmNsaXBib2FyZC53cml0ZVRleHQodGV4dCkudGhlbigoKSA9PiBjb25zb2xlLmxvZygnQ29waWVkOicsIHRleHQpKTtcbiAgfVxufSAiLCI8ZGl2IGNsYXNzPVwibWF4LXctNnhsIG14LWF1dG8gcC01IGZvbnQtc2FucyB0ZXh0LWdyYXktODAwXCI+XG4gIDxoZWFkZXIgY2xhc3M9XCJ0ZXh0LWNlbnRlciBweS0xMCBiZy13aGl0ZSByb3VuZGVkLWxnIG1iLTggc2hhZG93LXNtXCI+XG4gICAgPGgxIGNsYXNzPVwidGV4dC00eGwgZm9udC1ib2xkIG1iLTJcIj5EZW1vIFNjcm9sbCBPdmVybGF5PC9oMT5cbiAgICA8cCBjbGFzcz1cInRleHQteGwgdGV4dC1ncmF5LTUwMFwiPiYjNjQ7bGlicy11aS9jb21wb25lbnRzLXNjcm9sbC1vdmVybGF5PC9wPlxuICA8L2hlYWRlcj5cblxuICA8bWFpbj5cbiAgICA8IS0tIEdp4bubaSB0aGnhu4d1IC0tPlxuICAgIDxzZWN0aW9uIGNsYXNzPVwiYmctd2hpdGUgcm91bmRlZC1sZyBwLTggbWItOCBzaGFkb3ctc21cIj5cbiAgICAgIDxoMiBjbGFzcz1cInRleHQtMnhsIGZvbnQtYm9sZCBtYi01IHBiLTMgYm9yZGVyLWIgYm9yZGVyLWdyYXktMjAwXCI+R2nhu5tpIHRoaeG7h3U8L2gyPlxuICAgICAgPHA+PGNvZGU+c2Nyb2xsLW92ZXJsYXk8L2NvZGU+IGzDoCBt4buZdCBkaXJlY3RpdmUgZ2nDunAgdHXhu7MgYmnhur9uIHNjcm9sbGJhciB0csOqbiBi4bqldCBr4buzIHBo4bqnbiB04butIG7DoG8gdHJvbmcgQW5ndWxhciwgaOG7lyB0cuG7oyB0deG7syBjaOG7iW5oIG3DoHUsIGvDrWNoIHRoxrDhu5tjLCDhuqluL2hp4buHbiB2w6Agc+G7sSBraeG7h24gc2Nyb2xsLjwvcD5cbiAgICA8L3NlY3Rpb24+XG5cbiAgICA8IS0tIEPDoGkgxJHhurd0IC0tPlxuICAgIDxzZWN0aW9uIGNsYXNzPVwiYmctd2hpdGUgcm91bmRlZC1sZyBwLTggbWItOCBzaGFkb3ctc21cIj5cbiAgICAgIDxoMiBjbGFzcz1cInRleHQtMnhsIGZvbnQtYm9sZCBtYi01IHBiLTMgYm9yZGVyLWIgYm9yZGVyLWdyYXktMjAwXCI+Q8OgaSDEkeG6t3Q8L2gyPlxuICAgICAgPGRpdiBjbGFzcz1cImZsZXggaXRlbXMtY2VudGVyIGJnLWdyYXktMTAwIHAtNCByb3VuZGVkLWxnIG1iLTRcIj5cbiAgICAgICAgPHByZSBjbGFzcz1cImZsZXgtMSB0ZXh0LXNtIG92ZXJmbG93LXgtYXV0b1wiPjxjb2RlPnt7IGluc3RhbGxDb21tYW5kTnBtIH19PC9jb2RlPjwvcHJlPlxuICAgICAgICA8YnV0dG9uIGNsYXNzPVwibWwtNCBweC0zIHB5LTEgYmctYmx1ZS01MDAgdGV4dC13aGl0ZSByb3VuZGVkIGhvdmVyOmJnLWJsdWUtNjAwXCIgKGNsaWNrKT1cImNvcHlUb0NsaXBib2FyZChpbnN0YWxsQ29tbWFuZE5wbSlcIj5TYW8gY2jDqXA8L2J1dHRvbj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjbGFzcz1cImZsZXggaXRlbXMtY2VudGVyIGJnLWdyYXktMTAwIHAtNCByb3VuZGVkLWxnXCI+XG4gICAgICAgIDxwcmUgY2xhc3M9XCJmbGV4LTEgdGV4dC1zbSBvdmVyZmxvdy14LWF1dG9cIj48Y29kZT57eyBpbnN0YWxsQ29tbWFuZFlhcm4gfX08L2NvZGU+PC9wcmU+XG4gICAgICAgIDxidXR0b24gY2xhc3M9XCJtbC00IHB4LTMgcHktMSBiZy1ibHVlLTUwMCB0ZXh0LXdoaXRlIHJvdW5kZWQgaG92ZXI6YmctYmx1ZS02MDBcIiAoY2xpY2spPVwiY29weVRvQ2xpcGJvYXJkKGluc3RhbGxDb21tYW5kWWFybilcIj5TYW8gY2jDqXA8L2J1dHRvbj5cbiAgICAgIDwvZGl2PlxuICAgIDwvc2VjdGlvbj5cblxuICAgIDwhLS0gRGVtbyBUcuG7sWMgdGnhur9wIC0tPlxuICAgIDxzZWN0aW9uIGNsYXNzPVwiYmctd2hpdGUgcm91bmRlZC1sZyBwLTggbWItOCBzaGFkb3ctc21cIj5cbiAgICAgIDxoMiBjbGFzcz1cInRleHQtMnhsIGZvbnQtYm9sZCBtYi01IHBiLTMgYm9yZGVyLWIgYm9yZGVyLWdyYXktMjAwXCI+RGVtbyBUcuG7sWMgdGnhur9wPC9oMj5cbiAgICAgIDxkaXYgY2xhc3M9XCJncmlkIGdyaWQtY29scy00IGdhcC00IG1iLTZcIj5cbiAgICAgICAgPGJ1dHRvbiAqbmdGb3I9XCJsZXQgc2Mgb2Ygc2NlbmFyaW9PcHRpb25zXCJcbiAgICAgICAgICAoY2xpY2spPVwic2VsZWN0ZWRTY2VuYXJpbyA9IHNjXCJcbiAgICAgICAgICBjbGFzcz1cInB4LTMgcHktMSBib3JkZXIgcm91bmRlZFwiXG4gICAgICAgICAgW2NsYXNzLmJnLWJsdWUtNTAwXT1cInNlbGVjdGVkU2NlbmFyaW89PT1zY1wiXG4gICAgICAgICAgW2NsYXNzLnRleHQtd2hpdGVdPVwic2VsZWN0ZWRTY2VuYXJpbz09PXNjXCI+XG4gICAgICAgICAge3sgc2MgfX1cbiAgICAgICAgPC9idXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICAgIDxkaXYgY2xhc3M9XCJwLTQgYmctZ3JheS01MCByb3VuZGVkLWxnIGgtWzMwMHB4XVwiPlxuICAgICAgICA8ZGl2IExpYnNVaUNvbXBvbmVudHNTY3JvbGxPdmVybGF5RGlyZWN0aXZlXG4gICAgICAgICAgICAgW29wdGlvbnNdPVwib3B0aW9uc1wiXG4gICAgICAgICAgICAgKG91dFNjcm9sbCk9XCJvblNjcm9sbCgpXCJcbiAgICAgICAgICAgICAob3V0U2Nyb2xsVG9wKT1cIm9uU2Nyb2xsVG9wKClcIlxuICAgICAgICAgICAgIChvdXRTY3JvbGxCb3R0b20pPVwib25TY3JvbGxCb3R0b20oKVwiXG4gICAgICAgICAgICAgY2xhc3M9XCJ3LWZ1bGwgaC1mdWxsXCI+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cInAtMlwiXG4gICAgICAgICAgICAgICBbaW5uZXJUZXh0XT1cImNvbnRlbnRcIlxuICAgICAgICAgICAgICAgW2NsYXNzLndoaXRlc3BhY2UtcHJlLXdyYXBdPVwic2VsZWN0ZWRTY2VuYXJpbyE9PSdob3Jpem9udGFsJ1wiXG4gICAgICAgICAgICAgICBbY2xhc3Mud2hpdGVzcGFjZS1ub3dyYXBdPVwic2VsZWN0ZWRTY2VuYXJpbz09PSdob3Jpem9udGFsJ1wiPjwvZGl2PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAgPHAgY2xhc3M9XCJtdC00IHRleHQtZ3JheS03MDBcIj5T4buxIGtp4buHbjoge3sgbGFzdEV2ZW50KCkgfX08L3A+XG4gICAgPC9zZWN0aW9uPlxuXG4gICAgPCEtLSBDw6FjaCBz4butIGThu6VuZyAtLT5cbiAgICA8c2VjdGlvbiBjbGFzcz1cImJnLXdoaXRlIHJvdW5kZWQtbGcgcC04IG1iLTggc2hhZG93LXNtXCI+XG4gICAgICA8aDIgY2xhc3M9XCJ0ZXh0LTJ4bCBmb250LWJvbGQgbWItNSBwYi0zIGJvcmRlci1iIGJvcmRlci1ncmF5LTIwMFwiPkPDoWNoIHPhu60gZOG7pW5nPC9oMj5cbiAgICAgIDxwcmUgY2xhc3M9XCJiZy1ncmF5LTEwMCBwLTQgcm91bmRlZC1sZyBvdmVyZmxvdy1hdXRvIHRleHQtc21cIj5cbiAgICAgICAgPGNvZGUgbmdOb25CaW5kYWJsZT4mbHQ7ZGl2IExpYnNVaUNvbXBvbmVudHNTY3JvbGxPdmVybGF5RGlyZWN0aXZlIFtvcHRpb25zXT1cIiYjMTIzOyBzY3JvbGxiYXJXaWR0aDoxMiwgc2Nyb2xsVGh1bWJDb2xvcjonIzNiODJmNicgJiMxMjU7XCIgc3R5bGU9XCJ3aWR0aDozMDBweDtoZWlnaHQ6MjAwcHg7b3ZlcmZsb3c6YXV0bztcIiZndDtcbiAgTuG7mWkgZHVuZyBkw6BpLi4uXG4mbHQ7L2RpdiZndDs8L2NvZGU+XG4gICAgICA8L3ByZT5cbiAgICA8L3NlY3Rpb24+XG5cbiAgICA8IS0tIEFQSSBSZWZlcmVuY2UgLS0+XG4gICAgPHNlY3Rpb24gY2xhc3M9XCJiZy13aGl0ZSByb3VuZGVkLWxnIHAtOCBtYi04IHNoYWRvdy1zbVwiPlxuICAgICAgPGgyIGNsYXNzPVwidGV4dC0yeGwgZm9udC1ib2xkIG1iLTUgcGItMyBib3JkZXItYiBib3JkZXItZ3JheS0yMDBcIj5BUEkgUmVmZXJlbmNlPC9oMj5cbiAgICAgIDxoMyBjbGFzcz1cInRleHQteGwgZm9udC1zZW1pYm9sZCBtYi0zXCI+SW5wdXRzPC9oMz5cbiAgICAgIDx0YWJsZSBjbGFzcz1cIm1pbi13LWZ1bGwgYmctd2hpdGUgYm9yZGVyIGJvcmRlci1ncmF5LTIwMCBtYi02XCI+XG4gICAgICAgIDx0aGVhZD5cbiAgICAgICAgICA8dHI+XG4gICAgICAgICAgICA8dGggY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWIgYmctZ3JheS0xMDBcIj5Uw6puPC90aD5cbiAgICAgICAgICAgIDx0aCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYiBiZy1ncmF5LTEwMFwiPktp4buDdTwvdGg+XG4gICAgICAgICAgICA8dGggY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWIgYmctZ3JheS0xMDBcIj5N4bq3YyDEkeG7i25oPC90aD5cbiAgICAgICAgICAgIDx0aCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYiBiZy1ncmF5LTEwMFwiPk3DtCB04bqjPC90aD5cbiAgICAgICAgICA8L3RyPlxuICAgICAgICA8L3RoZWFkPlxuICAgICAgICA8dGJvZHk+XG4gICAgICAgICAgPHRyICpuZ0Zvcj1cImxldCBpbnB1dCBvZiBpbnB1dHNEb2NcIj5cbiAgICAgICAgICAgIDx0ZCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYlwiPjxjb2RlPnt7IGlucHV0Lm5hbWUgfX08L2NvZGU+PC90ZD5cbiAgICAgICAgICAgIDx0ZCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYlwiPjxjb2RlPnt7IGlucHV0LnR5cGUgfX08L2NvZGU+PC90ZD5cbiAgICAgICAgICAgIDx0ZCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYlwiPnt7IGlucHV0LmRlZmF1bHQgfX08L3RkPlxuICAgICAgICAgICAgPHRkIGNsYXNzPVwicHktMiBweC00IGJvcmRlci1iXCI+e3sgaW5wdXQuZGVzY3JpcHRpb24gfX08L3RkPlxuICAgICAgICAgIDwvdHI+XG4gICAgICAgIDwvdGJvZHk+XG4gICAgICA8L3RhYmxlPlxuICAgICAgPGgzIGNsYXNzPVwidGV4dC14bCBmb250LXNlbWlib2xkIG1iLTNcIj5PdXRwdXRzPC9oMz5cbiAgICAgIDx0YWJsZSBjbGFzcz1cIm1pbi13LWZ1bGwgYmctd2hpdGUgYm9yZGVyIGJvcmRlci1ncmF5LTIwMCBtYi02XCI+XG4gICAgICAgIDx0aGVhZD5cbiAgICAgICAgICA8dHI+XG4gICAgICAgICAgICA8dGggY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWIgYmctZ3JheS0xMDBcIj5Uw6puPC90aD5cbiAgICAgICAgICAgIDx0aCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYiBiZy1ncmF5LTEwMFwiPktp4buDdTwvdGg+XG4gICAgICAgICAgICA8dGggY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWIgYmctZ3JheS0xMDBcIj5Nw7QgdOG6ozwvdGg+XG4gICAgICAgICAgPC90cj5cbiAgICAgICAgPC90aGVhZD5cbiAgICAgICAgPHRib2R5PlxuICAgICAgICAgIDx0ciAqbmdGb3I9XCJsZXQgb3V0cHV0IG9mIG91dHB1dHNEb2NcIj5cbiAgICAgICAgICAgIDx0ZCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYlwiPjxjb2RlPnt7IG91dHB1dC5uYW1lIH19PC9jb2RlPjwvdGQ+XG4gICAgICAgICAgICA8dGQgY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWJcIj48Y29kZT57eyBvdXRwdXQudHlwZSB9fTwvY29kZT48L3RkPlxuICAgICAgICAgICAgPHRkIGNsYXNzPVwicHktMiBweC00IGJvcmRlci1iXCI+e3sgb3V0cHV0LmRlc2NyaXB0aW9uIH19PC90ZD5cbiAgICAgICAgICA8L3RyPlxuICAgICAgICA8L3Rib2R5PlxuICAgICAgPC90YWJsZT5cbiAgICAgIDxoMyBjbGFzcz1cInRleHQteGwgZm9udC1zZW1pYm9sZCBtYi0zXCI+T3B0aW9uczwvaDM+XG4gICAgICA8dGFibGUgY2xhc3M9XCJtaW4tdy1mdWxsIGJnLXdoaXRlIGJvcmRlciBib3JkZXItZ3JheS0yMDAgbWItNlwiPlxuICAgICAgICA8dGhlYWQ+XG4gICAgICAgICAgPHRyPlxuICAgICAgICAgICAgPHRoIGNsYXNzPVwicHktMiBweC00IGJvcmRlci1iIGJnLWdyYXktMTAwXCI+VGh14buZYyB0w61uaDwvdGg+XG4gICAgICAgICAgICA8dGggY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWIgYmctZ3JheS0xMDBcIj5LaeG7g3U8L3RoPlxuICAgICAgICAgICAgPHRoIGNsYXNzPVwicHktMiBweC00IGJvcmRlci1iIGJnLWdyYXktMTAwXCI+TeG6t2MgxJHhu4tuaDwvdGg+XG4gICAgICAgICAgICA8dGggY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWIgYmctZ3JheS0xMDBcIj5Nw7QgdOG6ozwvdGg+XG4gICAgICAgICAgPC90cj5cbiAgICAgICAgPC90aGVhZD5cbiAgICAgICAgPHRib2R5PlxuICAgICAgICAgIDx0ciAqbmdGb3I9XCJsZXQgb3B0IG9mIG9wdGlvbnNEb2NcIj5cbiAgICAgICAgICAgIDx0ZCBjbGFzcz1cInB5LTIgcHgtNCBib3JkZXItYlwiPjxjb2RlPnt7IG9wdC5uYW1lIH19PC9jb2RlPjwvdGQ+XG4gICAgICAgICAgICA8dGQgY2xhc3M9XCJweS0yIHB4LTQgYm9yZGVyLWJcIj48Y29kZT57eyBvcHQudHlwZSB9fTwvY29kZT48L3RkPlxuICAgICAgICAgICAgPHRkIGNsYXNzPVwicHktMiBweC00IGJvcmRlci1iXCI+e3sgb3B0LmRlZmF1bHQgfX08L3RkPlxuICAgICAgICAgICAgPHRkIGNsYXNzPVwicHktMiBweC00IGJvcmRlci1iXCI+e3sgb3B0LmRlc2NyaXB0aW9uIH19PC90ZD5cbiAgICAgICAgICA8L3RyPlxuICAgICAgICA8L3Rib2R5PlxuICAgICAgPC90YWJsZT5cbiAgICAgIDxoMyBjbGFzcz1cInRleHQteGwgZm9udC1zZW1pYm9sZCBtYi0zXCI+SW50ZXJmYWNlczwvaDM+XG4gICAgICA8ZGl2IGNsYXNzPVwic3BhY2UteS02XCI+XG4gICAgICAgIDxkaXYgKm5nRm9yPVwibGV0IGludGYgb2YgaW50ZXJmYWNlc0RvY1wiIGNsYXNzPVwiYmctZ3JheS01MCBwLTYgcm91bmRlZC1sZ1wiPlxuICAgICAgICAgIDxoNCBjbGFzcz1cImZvbnQtc2VtaWJvbGQgbWItMlwiPnt7IGludGYubmFtZSB9fTwvaDQ+XG4gICAgICAgICAgPHByZSBjbGFzcz1cImJnLWdyYXktMTAwIHAtNCByb3VuZGVkLWxnIG92ZXJmbG93LWF1dG8gdGV4dC1zbSBtYi0zXCI+PGNvZGU+e3sgaW50Zi50eXBlIH19PC9jb2RlPjwvcHJlPlxuICAgICAgICAgIDxwPnt7IGludGYuZGVzY3JpcHRpb24gfX08L3A+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC9zZWN0aW9uPlxuICA8L21haW4+XG48L2Rpdj5cbiJdfQ==

package/esm2022/index.mjs

@@ -1,3 +1,4 @@
 export * from './scroll-overlay.directive';
 export * from './scroll.interface';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvc2Nyb2xsLW92ZXJsYXkvc3JjL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNEJBQTRCLENBQUM7QUFDM0MsY0FBYyxvQkFBb0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vc2Nyb2xsLW92ZXJsYXkuZGlyZWN0aXZlJztcbmV4cG9ydCAqIGZyb20gJy4vc2Nyb2xsLmludGVyZmFjZSc7Il19
+export * from './demo/scroll-overlay.demo';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvc2Nyb2xsLW92ZXJsYXkvc3JjL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNEJBQTRCLENBQUM7QUFDM0MsY0FBYyxvQkFBb0IsQ0FBQztBQUNuQyxjQUFjLDRCQUE0QixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9zY3JvbGwtb3ZlcmxheS5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9zY3JvbGwuaW50ZXJmYWNlJztcbmV4cG9ydCAqIGZyb20gJy4vZGVtby9zY3JvbGwtb3ZlcmxheS5kZW1vJzsiXX0=