@bizy/core 19.14.2 → 19.14.3

package/fesm2022/bizy-core.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, ChangeDetectorRef, Output, Input, Inject, ChangeDetectionStrategy, Component, NgModule, inject, Renderer2, ElementRef, Injectable, Directive, ViewChild, ContentChildren, ContentChild, RendererFactory2, Pipe, ViewContainerRef, TemplateRef, HostListener, Host } from '@angular/core';
+import { EventEmitter, ChangeDetectorRef, Output, Input, Inject, ChangeDetectionStrategy, Component, NgModule, inject, Renderer2, ElementRef, Injectable, Directive, ViewChild, ContentChildren, ContentChild, Pipe, ViewContainerRef, TemplateRef, RendererFactory2, HostListener, Host } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, DOCUMENT, registerLocaleData, DatePipe } from '@angular/common';
 import { Subject, Subscription, BehaviorSubject, filter, take, skip, auditTime, throttleTime, debounceTime as debounceTime$1, interval, fromEvent, merge, timer, of } from 'rxjs';
@@ -24,11 +24,6 @@ import es_ES from '@uppy/locales/lib/es_ES';
 import en_US from '@uppy/locales/lib/en_US';
 import Dashboard from '@uppy/dashboard';
 import XHRUpload from '@uppy/xhr-upload';
-import * as i1$1 from '@angular/router';
-import { NavigationEnd, NavigationStart, Router } from '@angular/router';
-import validator from 'validator';
-import { Clipboard } from '@angular/cdk/clipboard';
-import { DeviceDetectorService } from 'ngx-device-detector';
 import * as i3 from '@angular/cdk/portal';
 import { TemplatePortal, PortalModule } from '@angular/cdk/portal';
 import { ScrollingModule, CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
@@ -36,6 +31,11 @@ import * as i1$2 from '@angular/cdk/dialog';
 import { DIALOG_DATA, DialogRef, DialogModule, Dialog } from '@angular/cdk/dialog';
 import * as i2$3 from '@angular/cdk/drag-drop';
 import { DragDropModule } from '@angular/cdk/drag-drop';
+import * as i1$1 from '@angular/router';
+import { NavigationEnd, NavigationStart, Router } from '@angular/router';
+import validator from 'validator';
+import { Clipboard } from '@angular/cdk/clipboard';
+import { DeviceDetectorService } from 'ngx-device-detector';
 import { TranslateService, TranslateModule } from '@ngx-translate/core';
 import * as i1$3 from '@angular/platform-browser';
 import { DomSanitizer } from '@angular/platform-browser';
@@ -2529,2320 +2529,2347 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
             args: [{ selector: 'bizy-filter-content', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem}\n"] }]
         }] });
 
-var BIZY_ANIMATION;
-(function (BIZY_ANIMATION) {
-    BIZY_ANIMATION["FADE_IN"] = "fade-in";
-    BIZY_ANIMATION["FADE_OUT"] = "fade-out";
-    BIZY_ANIMATION["FADE_IN_UP"] = "fade-in-up";
-    BIZY_ANIMATION["FADE_IN_RIGHT"] = "fade-in-right";
-    BIZY_ANIMATION["FADE_IN_DOWN"] = "fade-in-down";
-    BIZY_ANIMATION["FADE_IN_LEFT"] = "fade-in-left";
-    BIZY_ANIMATION["SLIDE_IN_UP"] = "slide-in-up";
-    BIZY_ANIMATION["SLIDE_IN_RIGHT"] = "slide-in-right";
-    BIZY_ANIMATION["SLIDE_IN_DOWN"] = "slide-in-down";
-    BIZY_ANIMATION["SLIDE_IN_LEFT"] = "slide-in-left";
-    BIZY_ANIMATION["SLIDE_OUT_UP"] = "slide-out-up";
-    BIZY_ANIMATION["SLIDE_OUT_DOWN"] = "slide-out-down";
-    BIZY_ANIMATION["SLIDE_OUT_RIGHT"] = "slide-out-right";
-    BIZY_ANIMATION["SLIDE_OUT_LEFT"] = "slide-out-left";
-})(BIZY_ANIMATION || (BIZY_ANIMATION = {}));
-class BizyAnimationService {
-    rendererFactory;
-    #renderer;
-    constructor(rendererFactory) {
-        this.rendererFactory = rendererFactory;
-        this.#renderer = this.rendererFactory.createRenderer(null, null);
-    }
-    setAnimation(element, animation) {
-        return new Promise(resolve => {
-            if (!element || !animation || !this.#renderer) {
+class BizyFilterPipe {
+    transform(items, property, states) {
+        if (!items || items.length === 0) {
+            return [];
+        }
+        if (!property || typeof states === 'undefined' || states === null) {
+            return items;
+        }
+        if (!Array.isArray(states)) {
+            return items.filter(_item => _item[property] === states);
+        }
+        if (states.length === 0) {
+            return items;
+        }
+        const _selected = states.filter(_state => _state.selected);
+        if (_selected.length === states.length) {
+            return items;
+        }
+        let output = [];
+        states.forEach(state => {
+            if (!state.selected) {
                 return;
             }
-            const root = this.#renderer.selectRootElement(':root', true);
-            const animationTimeout = getComputedStyle(root).getPropertyValue('--bizy-animation-timeout').trim();
-            this.#renderer.addClass(element, 'animated');
-            this.#renderer.addClass(element, animation);
-            setTimeout(() => {
-                this.#renderer.removeClass(element, 'animated');
-                this.#renderer.removeClass(element, animation);
-                resolve();
-            }, Number(animationTimeout.match(/\d/g).join('')));
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAnimationService, deps: [{ token: RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAnimationService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAnimationService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [{ type: i0.RendererFactory2, decorators: [{
-                    type: Inject,
-                    args: [RendererFactory2]
-                }] }] });
-
-class BizyViewportService {
-    window;
-    #viewportSizeChanged;
-    get sizeChange$() {
-        return this.#viewportSizeChanged.asObservable();
-    }
-    constructor(window) {
-        this.window = window;
-        this.#viewportSizeChanged = new BehaviorSubject({
-            width: this.window.innerWidth,
-            height: this.window.innerHeight
-        });
-        fromEvent(window, 'resize')
-            .pipe(debounceTime(200), map((event) => ({
-            width: event.currentTarget.innerWidth,
-            height: event.currentTarget.innerHeight
-        })))
-            .subscribe(windowSize => {
-            this.#viewportSizeChanged.next(windowSize);
+            const res = items.filter(_item => {
+                let _state = _item;
+                const nestedProperty = property.split('.');
+                nestedProperty.forEach(_property => {
+                    _state = _state[_property];
+                });
+                if (typeof state.id === 'boolean') {
+                    return Boolean(_state) === state.id;
+                }
+                if (Array.isArray(_state)) {
+                    return _state.includes(state.id);
+                }
+                return _state === state.id;
+            });
+            output = output.concat(res);
         });
+        function safeStringify(obj) {
+            const seen = new WeakSet();
+            function replacer(_key, value) {
+                // Handle circular references
+                if (typeof value === 'object' && value !== null) {
+                    if (seen.has(value))
+                        return '[Circular]';
+                    seen.add(value);
+                }
+                // Handle BigInt
+                if (typeof value === 'bigint')
+                    return value.toString() + 'n';
+                // Handle Symbol and Function
+                if (typeof value === 'symbol')
+                    return value.toString();
+                if (typeof value === 'function')
+                    return `[Function: ${value.name || 'anonymous'}]`;
+                // Preserve Dates
+                if (value instanceof Date)
+                    return `__DATE__:${value.toISOString()}`;
+                return value;
+            }
+            // Sort keys consistently
+            const ordered = sortKeys(obj);
+            return JSON.stringify(ordered, replacer);
+        }
+        function sortKeys(obj) {
+            if (Array.isArray(obj)) {
+                return obj.map(sortKeys);
+            }
+            else if (obj && typeof obj === 'object' && !(obj instanceof Date)) {
+                return Object.keys(obj)
+                    .sort()
+                    .reduce((acc, key) => {
+                    acc[key] = sortKeys(obj[key]);
+                    return acc;
+                }, {});
+            }
+            return obj;
+        }
+        function uniqueObjects(items) {
+            const seen = new Set();
+            const result = [];
+            for (const item of items) {
+                const str = safeStringify(item);
+                if (!seen.has(str)) {
+                    seen.add(str);
+                    result.push(item);
+                }
+            }
+            return result;
+        }
+        return uniqueObjects(output);
     }
-    width() {
-        return this.window.screen.availWidth;
-    }
-    height() {
-        return this.window.screen.availHeight;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyViewportService, deps: [{ token: Window }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyViewportService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterPipe, isStandalone: true, name: "bizyFilter" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyViewportService, decorators: [{
-            type: Injectable,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterPipe, decorators: [{
+            type: Pipe,
             args: [{
-                    providedIn: 'root'
+                    name: 'bizyFilter'
                 }]
-        }], ctorParameters: () => [{ type: Window, decorators: [{
-                    type: Inject,
-                    args: [Window]
-                }] }] });
+        }] });
 
-class BizyKeyboardService {
-    document;
-    #shiftHolding = new BehaviorSubject(false);
-    #controlHolding = new BehaviorSubject(false);
-    get shiftHolding$() {
-        return this.#shiftHolding.asObservable();
-    }
-    get controlHolding$() {
-        return this.#controlHolding.asObservable();
-    }
-    constructor(document) {
-        this.document = document;
-        this.document.addEventListener('visibilitychange', () => {
-            this.#shiftHolding.next(false);
-            this.#controlHolding.next(false);
-        });
-        this.document.addEventListener('keydown', (event) => {
-            if (event.key === 'Shift') {
-                this.#shiftHolding.next(true);
-            }
-            if (event.key === 'Meta' || event.key === 'Control') {
-                this.#controlHolding.next(true);
-            }
-        });
-        this.document.addEventListener('keyup', (event) => {
-            if (event.key === 'Shift') {
-                this.#shiftHolding.next(false);
+class BizyRangeFilterPipe {
+    transform(items, property, range) {
+        if (!items || items.length === 0) {
+            return [];
+        }
+        if (!property || !range) {
+            return items;
+        }
+        const min = range.min ?? null;
+        const max = range.max ?? null;
+        let itemsWithoutProperty = [];
+        const output = items.filter(_item => {
+            let _value = _item;
+            const nestedProperty = property.split('.');
+            for (let i = 0; i < nestedProperty.length; i++) {
+                const _property = nestedProperty[i];
+                if (typeof _value[_property] === 'undefined' || _value[_property] === null) {
+                    itemsWithoutProperty.push(_item);
+                    return false;
+                }
+                _value = _value[_property];
             }
-            if (event.key === 'Meta' || event.key === 'Control') {
-                this.#controlHolding.next(false);
+            if (isNaN(_value)) {
+                return false;
             }
+            return (min === null || _value >= min) && (max === null || _value <= max);
         });
+        return itemsWithoutProperty.length === items.length ? items : output;
     }
-    isShiftHolding() {
-        return this.#shiftHolding.value;
-    }
-    isControlHolding() {
-        return this.#controlHolding.value;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyKeyboardService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyKeyboardService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRangeFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyRangeFilterPipe, isStandalone: true, name: "bizyRangeFilter" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyKeyboardService, decorators: [{
-            type: Injectable,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRangeFilterPipe, decorators: [{
+            type: Pipe,
             args: [{
-                    providedIn: 'root'
+                    name: 'bizyRangeFilter'
                 }]
-        }], ctorParameters: () => [{ type: Document, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }] });
+        }] });
 
-class BizyExportToCSVService {
-    document;
-    rendererFactory;
-    #loading = false;
-    #renderer;
-    constructor(document, rendererFactory) {
-        this.document = document;
-        this.rendererFactory = rendererFactory;
-        this.#renderer = this.rendererFactory.createRenderer(null, null);
-    }
-    download(data) {
-        if (this.#loading || !data.items || !Array.isArray(data.items) || !data.model) {
-            return;
-        }
-        try {
-            this.#loading = true;
-            const csv = this.getCSV(data);
-            if (!data.fileName) {
-                data.fileName = 'bizy-csv';
-            }
-            this.#downloadCSV({ csv, fileName: data.fileName });
-        }
-        finally {
-            this.#loading = false;
-        }
-    }
-    getCSV(data) {
-        let csv = '';
-        function escapeCommas(str) {
-            return str.includes(',') ? `"${str}"` : str;
-        }
-        for (const key in data.model) {
-            if (key) {
-                csv += `${data.model[key]},`;
-            }
-        }
-        data.items.forEach(_item => {
-            // Remove the last character (',')
-            csv = csv.slice(0, -1);
-            csv += '\n';
-            for (const key in data.model) {
-                let value = _item;
-                const nestedProperty = key.split('.');
-                for (let i = 0; i < nestedProperty.length; i++) {
-                    const _property = nestedProperty[i];
-                    if (value) {
-                        value = value[_property];
-                    }
-                    else {
-                        break;
-                    }
-                }
-                if (typeof value !== undefined && value !== null) {
-                    csv += `${escapeCommas(String(value).replace(/\n/g, ''))},`;
-                }
-                else {
-                    csv += ',';
-                }
-            }
-        });
-        if (csv && csv[csv.length - 1] === ',') {
-            // Remove the last character (',')
-            csv = csv.slice(0, -1);
-        }
-        return csv;
-    }
-    #downloadCSV(data) {
-        const blob = new Blob([data.csv], { type: 'text/csv;charset=utf-8;' });
-        const url = URL.createObjectURL(blob);
-        const downloadButton = this.#renderer.createElement('a');
-        downloadButton.setAttribute('download', data.fileName);
-        downloadButton.href = url;
-        this.#renderer.appendChild(this.document.body, downloadButton);
-        downloadButton.click();
-        this.#renderer.removeChild(this.document.body, downloadButton);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyExportToCSVService, deps: [{ token: DOCUMENT }, { token: RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyExportToCSVService, providedIn: 'root' });
+const COMPONENTS$i = [
+    BizyFilterComponent,
+    BizyFilterSectionComponent,
+    BizyFilterContentComponent,
+    BizyFilterSectionCheckboxOptionComponent,
+    BizyFilterSectionRangeOptionComponent,
+    BizyFilterSectionSearchOptionComponent,
+    BizyFilterSectionsComponent
+];
+const PIPES$1 = [
+    BizyFilterPipe,
+    BizyRangeFilterPipe
+];
+class BizyFilterModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, imports: [BizyFilterComponent,
+            BizyFilterSectionComponent,
+            BizyFilterContentComponent,
+            BizyFilterSectionCheckboxOptionComponent,
+            BizyFilterSectionRangeOptionComponent,
+            BizyFilterSectionSearchOptionComponent,
+            BizyFilterSectionsComponent, BizyFilterPipe,
+            BizyRangeFilterPipe], exports: [BizyFilterComponent,
+            BizyFilterSectionComponent,
+            BizyFilterContentComponent,
+            BizyFilterSectionCheckboxOptionComponent,
+            BizyFilterSectionRangeOptionComponent,
+            BizyFilterSectionSearchOptionComponent,
+            BizyFilterSectionsComponent, BizyFilterPipe,
+            BizyRangeFilterPipe] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, providers: PIPES$1, imports: [BizyFilterComponent,
+            BizyFilterSectionComponent,
+            BizyFilterSectionCheckboxOptionComponent,
+            BizyFilterSectionRangeOptionComponent,
+            BizyFilterSectionSearchOptionComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyExportToCSVService, decorators: [{
-            type: Injectable,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, decorators: [{
+            type: NgModule,
             args: [{
-                    providedIn: 'root'
+                    imports: COMPONENTS$i.concat(PIPES$1),
+                    exports: COMPONENTS$i.concat(PIPES$1),
+                    providers: PIPES$1
                 }]
-        }], ctorParameters: () => [{ type: Document, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }, { type: i0.RendererFactory2, decorators: [{
-                    type: Inject,
-                    args: [RendererFactory2]
-                }] }] });
+        }] });
 
-class BizyRouterService {
-    router;
-    static backPath = '';
-    transitionsEnd$;
-    transitionsStart$;
-    popStateEvent$;
-    routeChange$;
-    constructor(router) {
-        this.router = router;
-        this.transitionsEnd$ = this.router.events.pipe(filter$1(event => event instanceof NavigationEnd), map((event) => event.id), distinctUntilChanged(), map(() => this.router.routerState.snapshot.root));
-        this.transitionsStart$ = this.router.events.pipe(filter$1(event => event instanceof NavigationStart), map((event) => event.id), distinctUntilChanged(), map(() => this.router.routerState.snapshot.root));
-        this.popStateEvent$ = fromEvent(window, 'popstate');
-        this.routeChange$ = merge(this.transitionsEnd$, this.popStateEvent$).pipe(map(() => void 0));
-    }
-    getURL() {
-        return window.location.pathname;
-    }
-    getBackPath() {
-        return BizyRouterService.backPath;
-    }
-    getId(activatedRoute, param) {
-        return activatedRoute.snapshot.paramMap.get(param);
-    }
-    getQueryParam(activatedRoute, param) {
-        return activatedRoute.snapshot.queryParamMap.get(param);
-    }
-    getAllQueryParam() {
-        const params = new URL(window.location.href).searchParams;
-        const queryParams = {};
-        for (const [key, value] of params.entries()) {
-            queryParams[key] = value;
-        }
-        return queryParams;
-    }
-    goTo(data) {
-        if (data.replace) {
-            BizyRouterService.backPath = '';
-        }
-        else {
-            BizyRouterService.backPath = this.getURL();
-        }
-        if (data.path[0] === '/') {
-            this.router.navigateByUrl(`${data.path}${this._serialize(data.params)}`, { replaceUrl: data.replace ?? false, skipLocationChange: data.skip ?? false });
+class BizySelectOptionComponent {
+    elementRef;
+    ref;
+    id = `bizy-select-option-${Math.random()}`;
+    disabled = false;
+    customClass = '';
+    onSelect = new EventEmitter();
+    set selected(selected) {
+        if (typeof selected === 'undefined' || selected === null) {
             return;
         }
-        const path = this.getURL();
-        const index = path.indexOf('?');
-        const url = index !== -1 ? path.substring(0, index) : path;
-        this.router.navigateByUrl(`${url}/${data.path}${this._serialize(data.params)}`, { replaceUrl: data.replace ?? false, skipLocationChange: data.skip ?? false });
+        this.#selected.next(selected);
     }
-    goBack(data) {
-        if (BizyRouterService.backPath) {
-            history.back();
-            BizyRouterService.backPath = '';
-        }
-        else if (data && data.path) {
-            this.router.navigateByUrl(data.path, { replaceUrl: true });
-        }
-        else {
-            const index = this.getURL().lastIndexOf('/');
-            const backURL = this.getURL().substring(0, index);
-            this.router.navigateByUrl(backURL, { replaceUrl: true });
-        }
+    #selected = new BehaviorSubject(false);
+    get selected$() {
+        return this.#selected.asObservable();
     }
-    reload(force) {
-        if (force) {
-            window.location.reload();
-        }
-        else {
-            setTimeout(() => {
-                this.router.navigateByUrl('/', { skipLocationChange: true }).then(() => {
-                    this.goTo({ path: this.getURL(), params: this.getAllQueryParam() });
-                });
-            }, 1);
-        }
+    constructor(elementRef, ref) {
+        this.elementRef = elementRef;
+        this.ref = ref;
     }
-    _serialize(params) {
-        if (!params) {
-            return '';
-        }
-        const str = [];
-        for (const param in params) {
-            if (params[param]) {
-                str.push(encodeURIComponent(param) + '=' + encodeURIComponent(params[param]));
-            }
+    _onSelect() {
+        if (this.disabled) {
+            return;
         }
-        const queryParams = str.length > 0 ? `?${str.join('&')}` : '';
-        return queryParams;
+        this.onSelect.emit();
+        this.ref.detectChanges();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRouterService, deps: [{ token: Router }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRouterService, providedIn: 'root' });
+    getId = () => {
+        return this.id;
+    };
+    getSelected = () => {
+        return this.#selected.value;
+    };
+    getValue = () => {
+        const value = this.elementRef?.nativeElement?.firstChild?.children[0]?.innerText;
+        return value ?? '';
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectOptionComponent, deps: [{ token: ElementRef }, { token: ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizySelectOptionComponent, isStandalone: true, selector: "bizy-select-option", inputs: { id: "id", disabled: "disabled", customClass: "customClass", selected: "selected" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect()\"\n    (keyup.enter)=\"_onSelect()\"\n    [ngClass]=\"{'bizy-select-option--selected': (selected$ | async), 'bizy-select-option--disabled': disabled}\"\n    class=\"bizy-select-option {{customClass}}\">\n\n    <span class=\"bizy-select-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>", styles: [":host{font-size:1rem}.bizy-select-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-select-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-select-option-color);cursor:pointer}.bizy-select-option:hover{background-color:var(--bizy-select-option-hover-background-color)}.bizy-select-option--selected{background-color:var(--bizy-select-option-selected-background-color)!important}.bizy-select-option--selected ::ng-deep .bizy-select-option__content *{color:var(--bizy-select-option-selected-color)}.bizy-select-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-select-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;text-align:start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRouterService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [{ type: i1$1.Router, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectOptionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-select-option', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect()\"\n    (keyup.enter)=\"_onSelect()\"\n    [ngClass]=\"{'bizy-select-option--selected': (selected$ | async), 'bizy-select-option--disabled': disabled}\"\n    class=\"bizy-select-option {{customClass}}\">\n\n    <span class=\"bizy-select-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>", styles: [":host{font-size:1rem}.bizy-select-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-select-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-select-option-color);cursor:pointer}.bizy-select-option:hover{background-color:var(--bizy-select-option-hover-background-color)}.bizy-select-option--selected{background-color:var(--bizy-select-option-selected-background-color)!important}.bizy-select-option--selected ::ng-deep .bizy-select-option__content *{color:var(--bizy-select-option-selected-color)}.bizy-select-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-select-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;text-align:start}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef, decorators: [{
                     type: Inject,
-                    args: [Router]
-                }] }] });
+                    args: [ElementRef]
+                }] }, { type: i0.ChangeDetectorRef, decorators: [{
+                    type: Inject,
+                    args: [ChangeDetectorRef]
+                }] }], propDecorators: { id: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], customClass: [{
+                type: Input
+            }], onSelect: [{
+                type: Output
+            }], selected: [{
+                type: Input
+            }] } });
 
-class BizyCacheService {
-    router;
-    CACHE_PREFIX = 'BIZY-CACHE';
-    constructor(router) {
-        this.router = router;
-    }
-    getData(key) {
-        if (!key) {
-            key = this.router.getURL();
-        }
-        const data = sessionStorage.getItem(`${this.CACHE_PREFIX}-${key}`);
-        if (data) {
-            const _data = JSON.parse(data);
-            return Date.now() < _data.expiresAt ? _data.value : {};
-        }
-        return {};
+class BizySelectComponent {
+    ref;
+    #viewContainerRef = inject(ViewContainerRef);
+    templatePortalContent;
+    options;
+    bizyInput;
+    id = `bizy-select-${Math.random()}`;
+    disabled = false;
+    readonly = false;
+    placeholder = '';
+    customClass = '';
+    opened = false;
+    openedChange = new EventEmitter();
+    onSelect = new EventEmitter();
+    onOpen = new EventEmitter();
+    _optionValue = '';
+    optionPortal;
+    templatePortal = null;
+    #subscription = new Subscription();
+    #contentChildrenSubscription = new Subscription();
+    constructor(ref) {
+        this.ref = ref;
     }
-    setData(value, key, expiresAt) {
-        if (typeof value === 'undefined' || value === null) {
-            return;
+    get touched() {
+        return this.bizyInput ? this.bizyInput.touched : false;
+    }
+    ngAfterViewInit() {
+        this.templatePortal = new TemplatePortal(this.templatePortalContent, this.#viewContainerRef);
+        this._optionValue = '';
+        const option = this.options.find(_option => _option.getSelected());
+        if (option) {
+            this._optionValue = option.getValue();
         }
-        if (!key) {
-            key = this.router.getURL();
+        this.options.forEach(_option => {
+            this.#subscription.add(_option.onSelect.subscribe(() => {
+                this.close();
+                this.ref.detectChanges();
+            }));
+            this.#subscription.add(_option.selected$.pipe(filter(_value => _value === true)).subscribe(() => {
+                this._optionValue = _option.getValue();
+                this.ref.detectChanges();
+            }));
+        });
+        this.#contentChildrenSubscription.add(this.options.changes.subscribe(() => {
+            this.#subscription.unsubscribe();
+            this.#subscription = new Subscription();
+            this.options.forEach(_option => {
+                this.#subscription.add(_option.onSelect.subscribe(() => {
+                    this.close();
+                    this.ref.detectChanges();
+                }));
+                this.#subscription.add(_option.selected$.pipe(filter(_value => _value === true)).subscribe(() => {
+                    this._optionValue = _option.getValue();
+                    this.ref.detectChanges();
+                }));
+            });
+        }));
+        this.ref.detectChanges();
+    }
+    _onOpen(event) {
+        if (this.disabled || this.readonly) {
+            return;
         }
-        if (!expiresAt) {
-            const date = new Date();
-            date.setHours(23, 59, 59);
-            expiresAt = date.getTime();
+        this.opened = !this.opened;
+        this.onSelect.emit(event);
+        this.openedChange.emit(this.opened);
+        this.onOpen.emit(this.opened);
+        if (this.bizyInput) {
+            this.bizyInput.setFocus(true);
         }
-        const data = {
-            expiresAt,
-            value
-        };
-        sessionStorage.setItem(`${this.CACHE_PREFIX}-${key}`, JSON.stringify(data));
+        this.ref.detectChanges();
     }
-    remove(key) {
-        if (!key) {
-            key = this.router.getURL();
+    close = (event, select) => {
+        if (select && event && event.target && event.target === select.bizyInputWrapper.nativeElement) {
+            return;
+        }
+        this.opened = false;
+        this.openedChange.emit(this.opened);
+        this.onOpen.emit(this.opened);
+        this.ref.detectChanges();
+    };
+    setTouched(touched) {
+        if (this.bizyInput) {
+            this.bizyInput.setTouched(touched);
+            this.ref.detectChanges();
         }
-        sessionStorage.removeItem(`${this.CACHE_PREFIX}-${key}`);
     }
-    removeAll() {
-        const cacheKeys = Object.keys(sessionStorage).filter(key => {
-            return key.includes(this.CACHE_PREFIX);
-        });
-        cacheKeys.forEach(value => {
-            sessionStorage.removeItem(value);
-        });
+    ngOnDestroy() {
+        this.#subscription.unsubscribe();
+        this.#contentChildrenSubscription.unsubscribe();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCacheService, deps: [{ token: BizyRouterService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCacheService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectComponent, deps: [{ token: ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizySelectComponent, isStandalone: true, selector: "bizy-select", inputs: { id: "id", disabled: "disabled", readonly: "readonly", placeholder: "placeholder", customClass: "customClass", opened: "opened" }, outputs: { openedChange: "openedChange", onSelect: "onSelect", onOpen: "onOpen" }, queries: [{ propertyName: "options", predicate: BizySelectOptionComponent }], viewQueries: [{ propertyName: "templatePortalContent", first: true, predicate: ["templatePortalContent"], descendants: true }, { propertyName: "bizyInput", first: true, predicate: ["bizyInput"], descendants: true }], ngImport: i0, template: "<bizy-input\n    #bizyInput\n    [readonly]=\"true\"\n    [disabled]=\"disabled\"\n    [id]=\"id\"\n    [placeholder]=\"placeholder\"\n    [value]=\"_optionValue\"\n    [ngClass]=\"{'bizy-select--readonly': readonly}\"\n    (onSelect)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    (onEnter)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    class=\"bizy-select {{customClass}}\"\n    cdkOverlayOrigin\n    #bizySelectTrigger=\"cdkOverlayOrigin\">\n\n    <svg \n        slot=\"suffix\"\n        id=\"bizy-select-arrow\"\n        *ngIf=\"!readonly\"\n        class=\"bizy-select__arrow\"\n        [ngClass]=\"{'bizy-select__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 320 512\">\n        <path d=\"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\"/>\n    </svg>\n\n    <ng-container slot=\"header\">\n        <ng-content select=\"[slot=header]\"></ng-content>\n    </ng-container>\n\n    <ng-container slot=\"prefix\">\n        <ng-content select=\"[slot=prefix]\"></ng-content>\n    </ng-container>\n\n</bizy-input>\n\n<span class=\"bizy-select__errors\" *ngIf=\"touched\">\n    <ng-content select=\"[slot=error]\"></ng-content>\n</span>\n\n<ng-template #templatePortalContent>\n    <ng-content select=\"bizy-select-option\"></ng-content>\n</ng-template>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayMinWidth]=\"bizyInput.getWidth()\"\n    [cdkConnectedOverlayOrigin]=\"bizySelectTrigger\"\n    (overlayOutsideClick)=\"close($event, bizyInput)\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-select__options\">\n\n        <span class=\"bizy-select__options__search\">\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-template [cdkPortalOutlet]=\"templatePortal\"></ng-template>\n    \n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem;width:var(--bizy-select-width);min-width:var(--bizy-select-min-width);max-width:var(--bizy-select-max-width);display:flex;flex-direction:column;row-gap:.3rem;--bizy-input-focus-color: transparent}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__bottom-line{background-color:var(--bizy-input-invalid-color)!important;visibility:visible!important}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__content__input{color:var(--bizy-input-invalid-color)!important}.bizy-select{--bizy-input-cursor: pointer;--bizy-input-background-color: var(--bizy-select-background-color);--bizy-input-color: var(--bizy-select-color)}.bizy-select--readonly{--bizy-input-cursor: default}.bizy-select__arrow{height:var(--bizy-select-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-select-color)}.bizy-select__arrow--opened{transform:rotate(180deg)}.bizy-select__options{background-color:var(--bizy-select-background-color);display:flex;min-width:fit-content;width:100%;flex-direction:column;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014;max-height:var(--bizy-select-height);overflow-y:auto;overflow-x:hidden;position:relative}.bizy-select__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-select__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-select-scroll-bar-color)}.bizy-select__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-select-scroll-bar-hover-color)}.bizy-select__options::-webkit-scrollbar-button{height:1rem}.bizy-select__options__search{position:sticky;z-index:1;top:0}::ng-deep .bizy-select__options__search{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto;margin-bottom:.3rem}.bizy-select__errors:empty{display:none!important}::ng-deep .bizy-select__errors *{color:var(--bizy-input-invalid-color)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "type", "customClass", "placeholder", "debounceTime", "rows", "disabled", "readonly", "autofocus", "value"], outputs: ["valueChange", "onChange", "onEnter", "onBackspace", "onSelect", "onBlur", "onFocus"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2$2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCacheService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [{ type: BizyRouterService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-select', imports: [CommonModule, BizyInputComponent, OverlayModule, PortalModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<bizy-input\n    #bizyInput\n    [readonly]=\"true\"\n    [disabled]=\"disabled\"\n    [id]=\"id\"\n    [placeholder]=\"placeholder\"\n    [value]=\"_optionValue\"\n    [ngClass]=\"{'bizy-select--readonly': readonly}\"\n    (onSelect)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    (onEnter)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    class=\"bizy-select {{customClass}}\"\n    cdkOverlayOrigin\n    #bizySelectTrigger=\"cdkOverlayOrigin\">\n\n    <svg \n        slot=\"suffix\"\n        id=\"bizy-select-arrow\"\n        *ngIf=\"!readonly\"\n        class=\"bizy-select__arrow\"\n        [ngClass]=\"{'bizy-select__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 320 512\">\n        <path d=\"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\"/>\n    </svg>\n\n    <ng-container slot=\"header\">\n        <ng-content select=\"[slot=header]\"></ng-content>\n    </ng-container>\n\n    <ng-container slot=\"prefix\">\n        <ng-content select=\"[slot=prefix]\"></ng-content>\n    </ng-container>\n\n</bizy-input>\n\n<span class=\"bizy-select__errors\" *ngIf=\"touched\">\n    <ng-content select=\"[slot=error]\"></ng-content>\n</span>\n\n<ng-template #templatePortalContent>\n    <ng-content select=\"bizy-select-option\"></ng-content>\n</ng-template>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayMinWidth]=\"bizyInput.getWidth()\"\n    [cdkConnectedOverlayOrigin]=\"bizySelectTrigger\"\n    (overlayOutsideClick)=\"close($event, bizyInput)\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-select__options\">\n\n        <span class=\"bizy-select__options__search\">\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-template [cdkPortalOutlet]=\"templatePortal\"></ng-template>\n    \n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem;width:var(--bizy-select-width);min-width:var(--bizy-select-min-width);max-width:var(--bizy-select-max-width);display:flex;flex-direction:column;row-gap:.3rem;--bizy-input-focus-color: transparent}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__bottom-line{background-color:var(--bizy-input-invalid-color)!important;visibility:visible!important}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__content__input{color:var(--bizy-input-invalid-color)!important}.bizy-select{--bizy-input-cursor: pointer;--bizy-input-background-color: var(--bizy-select-background-color);--bizy-input-color: var(--bizy-select-color)}.bizy-select--readonly{--bizy-input-cursor: default}.bizy-select__arrow{height:var(--bizy-select-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-select-color)}.bizy-select__arrow--opened{transform:rotate(180deg)}.bizy-select__options{background-color:var(--bizy-select-background-color);display:flex;min-width:fit-content;width:100%;flex-direction:column;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014;max-height:var(--bizy-select-height);overflow-y:auto;overflow-x:hidden;position:relative}.bizy-select__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-select__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-select-scroll-bar-color)}.bizy-select__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-select-scroll-bar-hover-color)}.bizy-select__options::-webkit-scrollbar-button{height:1rem}.bizy-select__options__search{position:sticky;z-index:1;top:0}::ng-deep .bizy-select__options__search{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto;margin-bottom:.3rem}.bizy-select__errors:empty{display:none!important}::ng-deep .bizy-select__errors *{color:var(--bizy-input-invalid-color)!important}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef, decorators: [{
                     type: Inject,
-                    args: [BizyRouterService]
-                }] }] });
+                    args: [ChangeDetectorRef]
+                }] }], propDecorators: { templatePortalContent: [{
+                type: ViewChild,
+                args: ['templatePortalContent']
+            }], options: [{
+                type: ContentChildren,
+                args: [BizySelectOptionComponent]
+            }], bizyInput: [{
+                type: ViewChild,
+                args: ['bizyInput']
+            }], id: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], customClass: [{
+                type: Input
+            }], opened: [{
+                type: Input
+            }], openedChange: [{
+                type: Output
+            }], onSelect: [{
+                type: Output
+            }], onOpen: [{
+                type: Output
+            }] } });
 
-class BizyValidatorService {
-    isEmail = (value) => validator.isEmail(value, { allow_utf8_local_part: false });
-    dateIsAfter = (data) => {
-        if (!data || !data.date || !data.comparisonDate) {
-            return false;
+class BizyFormComponent {
+    inputs;
+    selects;
+    datePickers;
+    id = `bizy-form-${Math.random()}`;
+    customClass = '';
+    onSubmit(event) {
+        this.setTouched();
+        event.preventDefault();
+    }
+    setTouched = () => {
+        if (this.inputs.length > 0) {
+            this.inputs.forEach(component => {
+                component.setTouched(true);
+            });
         }
-        const date = new Date(data.date);
-        const comparisonDate = new Date(data.comparisonDate);
-        return validator.isAfter(date.toString(), comparisonDate.toString());
-    };
-    dateIsBefore = (data) => {
-        if (!data || !data.date || !data.comparisonDate) {
-            return false;
+        if (this.selects.length > 0) {
+            this.selects.forEach(component => {
+                component.setTouched(true);
+            });
+        }
+        if (this.datePickers.length > 0) {
+            this.datePickers.forEach(component => {
+                component.setTouched(true);
+            });
         }
-        const date = new Date(data.date);
-        const comparisonDate = new Date(data.comparisonDate);
-        return validator.isBefore(date.toString(), comparisonDate.toString());
     };
-    isAlpha = (value) => validator.isAlpha(value);
-    isAlphanumeric = (value) => validator.isAlphanumeric(value);
-    isNumeric = (value) => validator.isNumeric(value);
-    isNumber(number) {
-        const regex = /^-?\d+(\.\d+)?$/;
-        return regex.test(String(number).toLowerCase());
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyFormComponent, isStandalone: true, selector: "bizy-form", inputs: { id: "id", customClass: "customClass" }, queries: [{ propertyName: "inputs", predicate: BizyInputComponent, descendants: true }, { propertyName: "selects", predicate: BizySelectComponent, descendants: true }, { propertyName: "datePickers", predicate: BizyDatePickerComponent, descendants: true }], ngImport: i0, template: "<form class=\"bizy-form {{customClass}}\" [id]=\"id\" (ngSubmit)=\"onSubmit($event)\">\n    <ng-content></ng-content>\n</form>", styles: [":host{font-size:1rem;max-width:var(--bizy-form-max-width)}.bizy-form{max-width:inherit;display:flex;flex-direction:column;row-gap:var(--bizy-form-row-gap);--bizy-input-max-width: 100%;--bizy-select-max-width: 100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-form', imports: [CommonModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form class=\"bizy-form {{customClass}}\" [id]=\"id\" (ngSubmit)=\"onSubmit($event)\">\n    <ng-content></ng-content>\n</form>", styles: [":host{font-size:1rem;max-width:var(--bizy-form-max-width)}.bizy-form{max-width:inherit;display:flex;flex-direction:column;row-gap:var(--bizy-form-row-gap);--bizy-input-max-width: 100%;--bizy-select-max-width: 100%}\n"] }]
+        }], propDecorators: { inputs: [{
+                type: ContentChildren,
+                args: [BizyInputComponent, { descendants: true }]
+            }], selects: [{
+                type: ContentChildren,
+                args: [BizySelectComponent, { descendants: true }]
+            }], datePickers: [{
+                type: ContentChildren,
+                args: [BizyDatePickerComponent, { descendants: true }]
+            }], id: [{
+                type: Input
+            }], customClass: [{
+                type: Input
+            }] } });
+
+const COMPONENTS$h = [
+    BizyFormComponent,
+];
+class BizyFormModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, imports: [BizyFormComponent], exports: [BizyFormComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, imports: [COMPONENTS$h] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: COMPONENTS$h,
+                    exports: COMPONENTS$h,
+                }]
+        }] });
+
+class BizyGridForDirective {
+    viewContainerRef = inject(ViewContainerRef);
+    templateRef = inject(TemplateRef);
+    #items = new BehaviorSubject([]);
+    get items$() {
+        return this.#items.asObservable();
     }
-    isString(string) {
-        return typeof string === 'string' || string instanceof String;
+    set gridForOf(items) {
+        this.#items.next(items);
     }
-    isInteger = (value) => validator.isInt(value);
-    isBoolean = (value) => validator.isBoolean(value);
-    isCreditCard = (value) => validator.isCreditCard(value);
-    isDataURI = (value) => validator.isDataURI(value);
-    isURL = (value) => validator.isURL(value);
-    isDate = (value) => validator.isDate(value);
-    isJSON = (value) => validator.isJSON(value);
-    isIP = (value, version) => validator.isIP(value, { version });
-    isJWT = (value) => validator.isJWT(value);
-    isLowercase = (value) => validator.isLowercase(value);
-    isUppercase = (value) => validator.isUppercase(value);
-    isMobilePhone = (data) => validator.isMobilePhone(data.value, data.locale);
-    isCUIT(cuit) {
-        const regex = /(^[0-9]{2}-[0-9]{8}-[0-9]$)/i;
-        const isCUIT = regex.test(String(cuit).toLowerCase());
-        if (!isCUIT) {
-            return false;
-        }
-        cuit = String(cuit).replace(/[-_]/g, '');
-        if (cuit.length == 11) {
-            const mult = [5, 4, 3, 2, 7, 6, 5, 4, 3, 2];
-            let total = 0;
-            for (let i = 0; i < mult.length; i++) {
-                total += parseInt(cuit[i]) * mult[i];
-            }
-            const mod = total % 11;
-            const digit = mod === 0 ? 0 : mod === 1 ? 9 : 11 - mod;
-            return digit === parseInt(cuit[10]);
-        }
-        return false;
-    }
-    isDNI(dni) {
-        const regex = /(^[1-9]{1}[0-9]{7}$)/i;
-        return regex.test(String(dni).toLowerCase());
-    }
-    isCBU(cbu) {
-        const _isLengthOk = (cbu) => {
-            return cbu.length === 22;
-        };
-        const _isValidAccount = (account) => {
-            if (account.length !== 14) {
-                return false;
-            }
-            const sum = Number(account[0]) * 3 +
-                Number(account[1]) * 9 +
-                Number(account[2]) * 7 +
-                Number(account[3]) * 1 +
-                Number(account[4]) * 3 +
-                Number(account[5]) * 9 +
-                Number(account[6]) * 7 +
-                Number(account[7]) * 1 +
-                Number(account[8]) * 3 +
-                Number(account[9]) * 9 +
-                Number(account[10]) * 7 +
-                Number(account[11]) * 1 +
-                Number(account[12]) * 3;
-            const diff = (10 - (sum % 10)) % 10; // The result of this should be only 1 digit
-            const checksum = Number(account[13]);
-            return diff === checksum;
-        };
-        const _isValidBankCode = (code) => {
-            if (code.length !== 8) {
-                return false;
-            }
-            const bank = code.substring(0, 3);
-            const checksumOne = code[3];
-            const branch = code.substring(4, 4 + 3);
-            const checksumTwo = code[7];
-            const sum = (Number(bank[0]) * 7) +
-                (Number(bank[1]) * 1) +
-                (Number(bank[2]) * 3) +
-                (Number(checksumOne) * 9) +
-                (Number(branch[0]) * 7) +
-                (Number(branch[1]) * 1) +
-                (Number(branch[2]) * 3);
-            const diff = (10 - (sum % 10)) % 10; // The result of this should be only 1 digit
-            return diff === Number(checksumTwo);
-        };
-        const bankCode = cbu.substring(0, 8);
-        const accountCode = cbu.substring(8, 8 + 14);
-        return (_isLengthOk(cbu) &&
-            _isValidBankCode(bankCode) &&
-            _isValidAccount(accountCode));
-    }
-    emailValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isEmail(control.value))
-                ? null
-                : { anuraEmail: true };
-        };
-    }
-    mobilePhoneValidator(locale) {
-        return (control) => {
-            return !control.value || !locale ||
-                (control.value && locale && this.isMobilePhone({ value: control.value, locale }))
-                ? null
-                : { anuraMobilePhone: true };
-        };
-    }
-    numberValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isNumber(control.value))
-                ? null
-                : { anuraNumber: true };
-        };
-    }
-    numericValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isNumeric(control.value))
-                ? null
-                : { anuraNumeric: true };
-        };
-    }
-    dateIsAfterValidator(comparisonDate) {
-        return (control) => {
-            return !control.value || !comparisonDate || (control.value && comparisonDate && !this.dateIsAfter({ date: control.value, comparisonDate }))
-                ? null
-                : { anuraDateIsAfter: true };
-        };
-    }
-    dateIsBeforeValidator(comparisonDate) {
-        return (control) => {
-            return !control.value || !comparisonDate || (control.value && comparisonDate && !this.dateIsBefore({ date: control.value, comparisonDate }))
-                ? null
-                : { anuraDateIsBefore: true };
-        };
-    }
-    alphaValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isAlpha(control.value))
-                ? null
-                : { anuraAlpha: true };
-        };
-    }
-    alphanumericValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isAlphanumeric(control.value))
-                ? null
-                : { anuraAlphanumeric: true };
-        };
-    }
-    integerValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isInteger(control.value))
-                ? null
-                : { anuraInteger: true };
-        };
-    }
-    dataURIValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isDataURI(control.value))
-                ? null
-                : { anuraDataURI: true };
-        };
-    }
-    urlValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isURL(control.value))
-                ? null
-                : { anuraURL: true };
-        };
-    }
-    jsonValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isJSON(control.value))
-                ? null
-                : { anuraJSON: true };
-        };
-    }
-    jwtValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isJWT(control.value))
-                ? null
-                : { anuraJWT: true };
-        };
-    }
-    lowerCaseValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isLowercase(control.value))
-                ? null
-                : { anuraLowerCase: true };
-        };
-    }
-    upperCaseValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isUppercase(control.value))
-                ? null
-                : { anuraUpperCase: true };
-        };
-    }
-    cuitValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isCUIT(control.value))
-                ? null
-                : { anuraCUIT: true };
-        };
-    }
-    dniValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isDNI(control.value))
-                ? null
-                : { anuraDNI: true };
-        };
-    }
-    cbuValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isCBU(control.value))
-                ? null
-                : { anuraCBU: true };
-        };
-    }
-    creditCardValidator() {
-        return (control) => {
-            return !control.value || (control.value && this.isCreditCard(control.value))
-                ? null
-                : { anuraCreditCard: true };
-        };
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyValidatorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyValidatorService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridForDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: BizyGridForDirective, isStandalone: true, selector: "[gridFor]", inputs: { gridForOf: "gridForOf" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyValidatorService, decorators: [{
-            type: Injectable,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridForDirective, decorators: [{
+            type: Directive,
             args: [{
-                    providedIn: 'root'
+                    selector: '[gridFor]',
                 }]
-        }] });
+        }], propDecorators: { gridForOf: [{
+                type: Input,
+                args: ['gridForOf']
+            }] } });
 
-class BizyStorageService {
-    get(key) {
-        const item = localStorage.getItem(key);
-        try {
-            return JSON.parse(item);
-        }
-        catch (e) {
-            return item;
-        }
-    }
-    set(key, value) {
-        if (typeof value === 'object') {
-            localStorage.setItem(key, JSON.stringify(value));
-        }
-        else if (typeof value === 'string') {
-            localStorage.setItem(key, value);
+class BizyGridRowComponent {
+    #elementRef = inject(ElementRef);
+    #ref = inject(ChangeDetectorRef);
+    #renderer = inject(Renderer2);
+    rowHeight = 100; // Px
+    set itemsPerRow(itemsPerRow) {
+        if (!this.#elementRef.nativeElement) {
+            return;
         }
-        else {
-            localStorage.setItem(key, String(value));
+        if (!itemsPerRow) {
+            itemsPerRow = 1;
         }
+        this.#renderer.setStyle(this.#elementRef.nativeElement, 'gridTemplateRows', `${this.rowHeight}px`);
+        this.#renderer.setStyle(this.#elementRef.nativeElement, 'gridTemplateColumns', `repeat(${itemsPerRow}, minmax(0, 1fr)`);
+        this.#ref.detectChanges();
     }
-    remove(key) {
-        localStorage.removeItem(key);
-    }
-    clear() {
-        localStorage.clear();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyStorageService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyGridRowComponent, isStandalone: true, selector: "bizy-grid-row", inputs: { rowHeight: "rowHeight", itemsPerRow: "itemsPerRow" }, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;display:grid;column-gap:var(--bizy-grid-gap);margin-bottom:var(--bizy-grid-gap)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyStorageService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }] });
-
-var COLOR;
-(function (COLOR) {
-    COLOR["DEFAULT"] = "#666666";
-    COLOR["INFO"] = "#2484C6";
-    COLOR["SUCCESS"] = "#65BF6C";
-    COLOR["WARNING"] = "#F7A64C";
-    COLOR["ERROR"] = "#EF4C59";
-})(COLOR || (COLOR = {}));
-class BizyLogService {
-    #lastLogTimestamp = 0;
-    #log(log, color, param) {
-        const difference = this.#lastLogTimestamp ? Date.now() - this.#lastLogTimestamp : 0;
-        this.#lastLogTimestamp = Date.now();
-        const timestampStyles = 'color: #EE5DFF';
-        const logStyles = `color: ${color}; font-size: 12px;`;
-        const date = new Date();
-        if (param) {
-            console.log(`%c${date.toLocaleString()}: %c${log} %c(+${difference}ms)`, timestampStyles, logStyles, timestampStyles, param);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridRowComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-grid-row', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;display:grid;column-gap:var(--bizy-grid-gap);margin-bottom:var(--bizy-grid-gap)}\n"] }]
+        }], propDecorators: { rowHeight: [{
+                type: Input
+            }], itemsPerRow: [{
+                type: Input
+            }] } });
+
+class BizyGridComponent {
+    ref;
+    document;
+    renderer;
+    elementRef;
+    content;
+    gridDirective;
+    resizeRef = null;
+    #rowScrollingMutationObserver;
+    #resizeObserver;
+    #subscription = new Subscription();
+    #view;
+    notifier$ = new Subject();
+    rowHeight = 100;
+    itemRows = [];
+    items = [];
+    itemTemplate;
+    itemsPerRow = 1;
+    constructor(ref, document, renderer, elementRef) {
+        this.ref = ref;
+        this.document = document;
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    ngAfterContentInit() {
+        if (this.gridDirective) {
+            this.#initView();
         }
         else {
-            console.log(`%c${date.toLocaleString()}: %c${log} %c(+${difference}ms)`, timestampStyles, logStyles, timestampStyles);
+            this.#rowScrollingMutationObserver = new MutationObserver(() => {
+                if (!this.gridDirective) {
+                    return;
+                }
+                this.#initView();
+                this.#rowScrollingMutationObserver.disconnect();
+                this.ref.detectChanges();
+            });
+            this.#rowScrollingMutationObserver.observe(this.document.body, { childList: true, subtree: true });
         }
     }
-    debug(data, param) {
-        if (typeof data === 'string') {
-            this.#log(data, COLOR.DEFAULT, param);
+    #initView = () => {
+        this.#subscription.add(this.gridDirective.items$.subscribe(items => {
+            if (this.items.length === 0 && items.length === 0) {
+                return;
+            }
+            this.items = items;
+            this.#updateView();
+        }));
+        if (!this.#view) {
+            this.#view = this.gridDirective.viewContainerRef;
+            this.#view.createEmbeddedView(this.content);
         }
-        else {
-            this.#template({ ...data, param: data.param, title: 'Debug', color: COLOR.DEFAULT });
+        this.#resizeObserver = new ResizeObserver(() => this.notifier$.next());
+        const resizeRef = this.resizeRef ? this.resizeRef : this.renderer.parentNode(this.elementRef.nativeElement) ? this.renderer.parentNode(this.elementRef.nativeElement) : this.elementRef.nativeElement;
+        this.#resizeObserver.observe(resizeRef);
+        this.#subscription.add(this.notifier$.pipe(debounceTime$1(50)).subscribe(() => {
+            this.#updateView();
+        }));
+    };
+    #updateView = () => {
+        this.itemTemplate = this.gridDirective.templateRef;
+        const rowWidth = this.elementRef.nativeElement.offsetWidth || this.elementRef.nativeElement.firstChild.offsetWidth;
+        let columnWidth = 100;
+        const fontSize = Number(getComputedStyle(this.elementRef.nativeElement).getPropertyValue('font-size').split('px')[0]);
+        const rowHeightParameter = getComputedStyle(this.elementRef.nativeElement).getPropertyValue('--bizy-grid-row-height');
+        if (rowHeightParameter && rowHeightParameter.includes('rem')) {
+            this.rowHeight = fontSize * Number(rowHeightParameter.split('rem')[0]);
         }
-    }
-    info(data, param) {
-        if (typeof data === 'string') {
-            this.#log(data, COLOR.INFO, param);
+        else if (rowHeightParameter && rowHeightParameter.includes('px')) {
+            this.rowHeight = Number(rowHeightParameter.split('px')[0]);
         }
-        else {
-            this.#template({ ...data, param: data.param, title: 'Info', color: COLOR.INFO });
+        let gap = 10;
+        const gapParameter = getComputedStyle(this.elementRef.nativeElement).getPropertyValue('--bizy-grid-gap');
+        if (gapParameter && gapParameter.includes('rem')) {
+            gap = fontSize * Number(gapParameter.split('rem')[0]);
         }
-    }
-    success(data, param) {
-        if (typeof data === 'string') {
-            this.#log(data, COLOR.SUCCESS, param);
+        else if (gapParameter && gapParameter.includes('px')) {
+            gap = Number(gapParameter.split('px')[0]);
         }
-        else {
-            this.#template({ ...data, param: data.param, title: 'Success', color: COLOR.SUCCESS });
+        const columnWidthParameter = getComputedStyle(this.elementRef.nativeElement).getPropertyValue('--bizy-grid-column-width');
+        if (columnWidthParameter && columnWidthParameter.includes('rem')) {
+            columnWidth = fontSize * Number(columnWidthParameter.split('rem')[0]);
         }
-    }
-    warning(data, param) {
-        if (typeof data === 'string') {
-            this.#log(data, COLOR.WARNING, param);
+        else if (columnWidthParameter && columnWidthParameter.includes('px')) {
+            columnWidth = Number(columnWidthParameter.split('px')[0]);
+        }
+        columnWidth += gap;
+        const count = Math.trunc(rowWidth / (columnWidth));
+        if (Math.round((gap * (count - 1)) + (columnWidth * count)) <= (rowWidth)) {
+            this.itemsPerRow = count <= 0 ? 1 : count;
         }
         else {
-            this.#template({ ...data, param: data.param, title: 'Warning', color: COLOR.WARNING });
+            this.itemsPerRow = (count - 1) <= 0 ? 1 : count - 1;
+        }
+        const itemRows = [];
+        for (let i = 0; i < this.items.length; i += this.itemsPerRow) {
+            const row = this.items.slice(i, i + this.itemsPerRow);
+            itemRows.push(row);
         }
+        this.itemRows = itemRows;
+        this.ref.detectChanges();
+    };
+    trackById(index, item) {
+        return item?.id ?? index;
     }
-    error(data, param) {
-        if (typeof data === 'string') {
-            this.#log(data, COLOR.ERROR, param);
+    ngOnDestroy() {
+        this.#subscription.unsubscribe();
+        if (this.#rowScrollingMutationObserver) {
+            this.#rowScrollingMutationObserver.disconnect();
         }
-        else {
-            this.#template({ ...data, param: data.param, title: 'Error', color: COLOR.ERROR });
+        if (this.#resizeObserver) {
+            this.#resizeObserver.disconnect();
         }
     }
-    /** DEPRECATED */
-    templateDebug(data) {
-        this.#template({ ...data, title: 'Debug', color: COLOR.DEFAULT });
-    }
-    /** DEPRECATED */
-    templateSucc(data) {
-        this.#template({ ...data, title: 'Success', color: COLOR.SUCCESS });
-    }
-    /** DEPRECATED */
-    templateInfo(data) {
-        this.#template({ ...data, title: 'Info', color: COLOR.INFO });
-    }
-    /** DEPRECATED */
-    templateWarn(data) {
-        this.#template({ ...data, title: 'Warning', color: COLOR.WARNING });
-    }
-    /** DEPRECATED */
-    templateError(data) {
-        this.#template({ ...data, title: 'Error', color: COLOR.ERROR });
-    }
-    #template(data) {
-        const log = `(${data.title}) ${data.fileName} - ${data.functionName}`;
-        this.#log(log, data.color, data.param);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyLogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyLogService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridComponent, deps: [{ token: ChangeDetectorRef }, { token: DOCUMENT }, { token: Renderer2 }, { token: ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyGridComponent, isStandalone: true, selector: "bizy-grid", inputs: { resizeRef: "resizeRef" }, queries: [{ propertyName: "gridDirective", first: true, predicate: BizyGridForDirective, descendants: true }], viewQueries: [{ propertyName: "content", first: true, predicate: ["gridScrollingContent"], descendants: true }], ngImport: i0, template: "<div class=\"bizy-grid\" [ngClass]=\"{'bizy-grid--empty': items && items.length === 0}\">\n\n    <cdk-virtual-scroll-viewport\n        class=\"bizy-grid__rows\"\n        [itemSize]=\"rowHeight\"\n        [minBufferPx]=\"rowHeight + (rowHeight * 5)\"\n        [maxBufferPx]=\"rowHeight + (rowHeight * 10)\">\n\n        <ng-content></ng-content>\n        \n        <ng-template #gridScrollingContent>\n            <ng-template let-item cdkVirtualFor [cdkVirtualForOf]=\"itemRows\">\n                <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n                    <ng-container *ngFor=\"let it of item; trackBy: trackById\">\n                        <ng-template *ngTemplateOutlet=\"itemTemplate; context: { $implicit: it }\"></ng-template>\n                    </ng-container>\n                </bizy-grid-row>\n            </ng-template>\n        </ng-template>\n    </cdk-virtual-scroll-viewport>\n\n</div>\n", styles: [":host{display:inline-block!important;min-height:var(--bizy-grid-min-height);max-height:var(--bizy-grid-max-height);height:var(--bizy-grid-height);width:var(--bizy-grid-width);flex:1;overflow-x:auto;overflow-y:hidden;font-size:1rem}:host:has(.bizy-grid--empty){height:0!important;min-height:0!important;max-height:0!important}.bizy-grid{width:inherit;height:inherit;min-width:fit-content;display:flex;flex-direction:column;row-gap:.3rem;overflow-x:clip;background-color:var(--bizy-grid-background-color)}.bizy-grid__rows{width:100%;display:flex;flex-direction:column;min-width:fit-content;overflow-x:hidden}::ng-deep .cdk-virtual-scrollable{height:100%;width:100%;overflow-y:auto!important;overflow-x:hidden!important;contain:inline-size!important}::ng-deep .cdk-virtual-scroll-content-wrapper{min-width:100%;max-width:100%}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar{width:.5rem;height:.5rem}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-grid-scroll-bar-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-grid-scroll-bar-hover-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-button{height:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2$2.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2$2.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2$2.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: BizyGridRowComponent, selector: "bizy-grid-row", inputs: ["rowHeight", "itemsPerRow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyLogService, decorators: [{
-            type: Injectable,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-grid', imports: [CommonModule, ScrollingModule, BizyGridRowComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bizy-grid\" [ngClass]=\"{'bizy-grid--empty': items && items.length === 0}\">\n\n    <cdk-virtual-scroll-viewport\n        class=\"bizy-grid__rows\"\n        [itemSize]=\"rowHeight\"\n        [minBufferPx]=\"rowHeight + (rowHeight * 5)\"\n        [maxBufferPx]=\"rowHeight + (rowHeight * 10)\">\n\n        <ng-content></ng-content>\n        \n        <ng-template #gridScrollingContent>\n            <ng-template let-item cdkVirtualFor [cdkVirtualForOf]=\"itemRows\">\n                <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n                    <ng-container *ngFor=\"let it of item; trackBy: trackById\">\n                        <ng-template *ngTemplateOutlet=\"itemTemplate; context: { $implicit: it }\"></ng-template>\n                    </ng-container>\n                </bizy-grid-row>\n            </ng-template>\n        </ng-template>\n    </cdk-virtual-scroll-viewport>\n\n</div>\n", styles: [":host{display:inline-block!important;min-height:var(--bizy-grid-min-height);max-height:var(--bizy-grid-max-height);height:var(--bizy-grid-height);width:var(--bizy-grid-width);flex:1;overflow-x:auto;overflow-y:hidden;font-size:1rem}:host:has(.bizy-grid--empty){height:0!important;min-height:0!important;max-height:0!important}.bizy-grid{width:inherit;height:inherit;min-width:fit-content;display:flex;flex-direction:column;row-gap:.3rem;overflow-x:clip;background-color:var(--bizy-grid-background-color)}.bizy-grid__rows{width:100%;display:flex;flex-direction:column;min-width:fit-content;overflow-x:hidden}::ng-deep .cdk-virtual-scrollable{height:100%;width:100%;overflow-y:auto!important;overflow-x:hidden!important;contain:inline-size!important}::ng-deep .cdk-virtual-scroll-content-wrapper{min-width:100%;max-width:100%}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar{width:.5rem;height:.5rem}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-grid-scroll-bar-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-grid-scroll-bar-hover-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-button{height:1rem}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef, decorators: [{
+                    type: Inject,
+                    args: [ChangeDetectorRef]
+                }] }, { type: Document, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }, { type: i0.Renderer2, decorators: [{
+                    type: Inject,
+                    args: [Renderer2]
+                }] }, { type: i0.ElementRef, decorators: [{
+                    type: Inject,
+                    args: [ElementRef]
+                }] }], propDecorators: { content: [{
+                type: ViewChild,
+                args: ['gridScrollingContent']
+            }], gridDirective: [{
+                type: ContentChild,
+                args: [BizyGridForDirective]
+            }], resizeRef: [{
+                type: Input
+            }] } });
+
+const COMPONENTS$g = [
+    BizyGridComponent,
+    BizyGridRowComponent
+];
+const DIRECTIVES$2 = [
+    BizyGridForDirective,
+];
+class BizyGridModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, imports: [BizyGridComponent,
+            BizyGridRowComponent, BizyGridForDirective], exports: [BizyGridComponent,
+            BizyGridRowComponent, BizyGridForDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, imports: [BizyGridComponent,
+            BizyGridRowComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, decorators: [{
+            type: NgModule,
             args: [{
-                    providedIn: 'root'
+                    imports: COMPONENTS$g.concat(DIRECTIVES$2),
+                    exports: COMPONENTS$g.concat(DIRECTIVES$2),
                 }]
         }] });
 
-class BizyCopyToClipboardService {
-    #clipboard = inject(Clipboard);
-    copy(data) {
-        return new Promise((resolve, reject) => {
-            try {
-                if (!data) {
-                    resolve();
-                    return;
-                }
-                setTimeout(() => {
-                    let toCopy = '';
-                    if (typeof data === 'string' || data instanceof String) {
-                        toCopy = data;
-                    }
-                    else if (data.items && data.items.length > 0 && data.model) {
-                        for (const key in data.model) {
-                            if (key) {
-                                toCopy += `${data.model[key]},`;
-                            }
-                        }
-                        data.items.forEach(_item => {
-                            // Remove the last character (',')
-                            toCopy = toCopy.slice(0, -2);
-                            toCopy += '\n';
-                            for (const key in data.model) {
-                                let value = _item;
-                                const nestedProperty = key.split('.');
-                                nestedProperty.forEach(_property => {
-                                    value = value[_property];
-                                });
-                                if (typeof value !== undefined && value !== null) {
-                                    toCopy += `${String(value).replace(/\n/g, '')},`;
-                                }
-                                else {
-                                    toCopy += ',';
-                                }
-                            }
-                        });
-                    }
-                    const pending = this.#clipboard.beginCopy(toCopy);
-                    let remainingAttempts = 3;
-                    const attempt = () => {
-                        const result = pending.copy();
-                        if (!result && --remainingAttempts) {
-                            setTimeout(attempt);
-                        }
-                        else {
-                            // Remember to destroy when you're done!
-                            pending.destroy();
-                            resolve();
-                        }
-                    };
-                    attempt();
-                }, 100);
-            }
-            catch (error) {
-                reject(error);
-            }
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCopyToClipboardService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCopyToClipboardService, providedIn: 'root' });
+const COMPONENTS$f = [
+    BizyInputComponent,
+    BizyInputOptionComponent
+];
+class BizyInputModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, imports: [BizyInputComponent,
+            BizyInputOptionComponent], exports: [BizyInputComponent,
+            BizyInputOptionComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, imports: [COMPONENTS$f] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCopyToClipboardService, decorators: [{
-            type: Injectable,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, decorators: [{
+            type: NgModule,
             args: [{
-                    providedIn: 'root'
+                    imports: COMPONENTS$f,
+                    exports: COMPONENTS$f,
                 }]
         }] });
 
-var BIZY_FORMAT_SECONDS_LANGUAGE;
-(function (BIZY_FORMAT_SECONDS_LANGUAGE) {
-    BIZY_FORMAT_SECONDS_LANGUAGE["SPANISH"] = "es";
-    BIZY_FORMAT_SECONDS_LANGUAGE["ENGLISH"] = "en";
-})(BIZY_FORMAT_SECONDS_LANGUAGE || (BIZY_FORMAT_SECONDS_LANGUAGE = {}));
-var BIZY_FORMAT_SECONDS_FORMAT;
-(function (BIZY_FORMAT_SECONDS_FORMAT) {
-    BIZY_FORMAT_SECONDS_FORMAT["DATE_TIME"] = "date-time";
-    BIZY_FORMAT_SECONDS_FORMAT["TIME"] = "time";
-})(BIZY_FORMAT_SECONDS_FORMAT || (BIZY_FORMAT_SECONDS_FORMAT = {}));
-class BizyFormatSecondsService {
-    #options = {
-        language: BIZY_FORMAT_SECONDS_LANGUAGE.SPANISH,
-        format: BIZY_FORMAT_SECONDS_FORMAT.TIME
-    };
-    getOptions() {
-        return this.#options;
-    }
-    setOptions(options) {
-        if (options && options.language) {
-            this.#options.language = options.language;
-        }
-        if (options && options.format) {
-            this.#options.format = options.format;
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormatSecondsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormatSecondsService, providedIn: 'root' });
+class BizyListComponent {
+    id = `bizy-list-${Math.random()}`;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyListComponent, isStandalone: true, selector: "bizy-list", inputs: { id: "id" }, host: { properties: { "id": "id" } }, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;height:var(--bizy-list-height);overflow:auto;width:var(--bizy-list-width);display:flex;flex-direction:var(--bizy-list-flex-direction);column-gap:var(--bizy-list-column-gap);row-gap:var(--bizy-list-row-gap);justify-content:var(--bizy-list-justify-content);align-items:var(--bizy-list-align-items)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormatSecondsService, decorators: [{
-            type: Injectable,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-list', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[id]': 'id'
+                    }, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;height:var(--bizy-list-height);overflow:auto;width:var(--bizy-list-width);display:flex;flex-direction:var(--bizy-list-flex-direction);column-gap:var(--bizy-list-column-gap);row-gap:var(--bizy-list-row-gap);justify-content:var(--bizy-list-justify-content);align-items:var(--bizy-list-align-items)}\n"] }]
+        }], propDecorators: { id: [{
+                type: Input
+            }] } });
+
+const COMPONENTS$e = [
+    BizyListComponent,
+];
+class BizyListModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, imports: [BizyListComponent], exports: [BizyListComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, imports: [COMPONENTS$e] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, decorators: [{
+            type: NgModule,
             args: [{
-                    providedIn: 'root'
+                    imports: COMPONENTS$e,
+                    exports: COMPONENTS$e,
                 }]
         }] });
 
-/**
- * Copyright 2020 Google LLC
- *
- * Licensed under the Apache License, Version 2.0 (the 'License');
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an 'AS IS' BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// This function's role is to enable smooth transition to the brave new world of
-// User-Agent Client Hints. If you have legacy code that relies on
-// `navigator.userAgent` and which relies on entropy that will go away by
-// default, you *need* to refactor it to use UA-CH. This function is to be used
-// as a stop gap, to enable smooth transition during that period.
-/**
-* @param {string[]} hints
-* @return {Promise<string|undefined>} A Promise that resolves to a string if a
-*   UA could be synthesized from client hints, otherwise undefined.
-*/
-async function getUserAgentUsingClientHints(hints) {
-    // Helper functions for platform specific strings
-    const GetCrosSpecificString = (values) => {
-        let osCPUFragment = '';
-        if (values.bitness == '64') {
-            if (values.architecture == 'x86') {
-                osCPUFragment = 'x86_64';
-            }
-            else if (values.architecture == 'arm') {
-                osCPUFragment = 'aarch64';
-            }
-        }
-        else if (values.architecture == 'arm' && values.bitness == '32') {
-            osCPUFragment = 'armv7l';
+class BizyMenuOptionComponent {
+    id = `bizy-menu-option-${Math.random()}`;
+    disabled = false;
+    customClass = '';
+    selected = false;
+    onSelect = new EventEmitter();
+    _onSelect(event) {
+        if (this.disabled) {
+            return;
         }
-        if (osCPUFragment == '') {
-            return `X11; CrOS ${values.platformVersion}`;
+        this.onSelect.emit(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyMenuOptionComponent, isStandalone: true, selector: "bizy-menu-option", inputs: { id: "id", disabled: "disabled", customClass: "customClass", selected: "selected" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    [ngClass]=\"{'bizy-menu-option--selected': selected, 'bizy-menu-option--disabled': disabled}\"\n    class=\"bizy-menu-option {{customClass}}\">\n\n    <span class=\"bizy-menu-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>\n\n<span class=\"bizy-menu-option__menu\">\n    <ng-content select=\"bizy-menu\"></ng-content>\n</span>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu-option__menu:not(:empty)) .bizy-menu-option{display:none!important}.bizy-menu-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-menu-option-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-menu-option-color);cursor:pointer}.bizy-menu-option:hover{background-color:var(--bizy-menu-option-hover-background-color)}.bizy-menu-option--selected{color:var(--bizy-menu-option-selected-color)!important;background-color:var(--bizy-menu-option-selected-background-color)!important}::ng-deep .bizy-menu-option--selected *{color:var(--bizy-menu-option-selected-color)!important}.bizy-menu-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-menu-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;width:100%}::ng-deep .bizy-menu-option__menu *{color:var(--bizy-menu-option-color);fill:var(--bizy-menu-option-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuOptionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-menu-option', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    [ngClass]=\"{'bizy-menu-option--selected': selected, 'bizy-menu-option--disabled': disabled}\"\n    class=\"bizy-menu-option {{customClass}}\">\n\n    <span class=\"bizy-menu-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>\n\n<span class=\"bizy-menu-option__menu\">\n    <ng-content select=\"bizy-menu\"></ng-content>\n</span>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu-option__menu:not(:empty)) .bizy-menu-option{display:none!important}.bizy-menu-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-menu-option-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-menu-option-color);cursor:pointer}.bizy-menu-option:hover{background-color:var(--bizy-menu-option-hover-background-color)}.bizy-menu-option--selected{color:var(--bizy-menu-option-selected-color)!important;background-color:var(--bizy-menu-option-selected-background-color)!important}::ng-deep .bizy-menu-option--selected *{color:var(--bizy-menu-option-selected-color)!important}.bizy-menu-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-menu-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;width:100%}::ng-deep .bizy-menu-option__menu *{color:var(--bizy-menu-option-color);fill:var(--bizy-menu-option-color)}\n"] }]
+        }], propDecorators: { id: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], customClass: [{
+                type: Input
+            }], selected: [{
+                type: Input
+            }], onSelect: [{
+                type: Output
+            }] } });
+
+class BizyMenuComponent {
+    #ref = inject(ChangeDetectorRef);
+    options;
+    id = `bizy-menu-${Math.random()}`;
+    disabled = false;
+    offsetX = 0;
+    offsetY = 0;
+    customClass = '';
+    hideArrow = false;
+    opened = false;
+    onSelect = new EventEmitter();
+    _menuWidth;
+    #subscription = new Subscription();
+    bizyMenuOptionsId = 'bizyMenuOptionsId';
+    _onSelect(event) {
+        if (this.disabled) {
+            return;
         }
-        return `X11; CrOS ${osCPUFragment} ${values.platformVersion}`;
-    };
-    const GetWindowsSpecificString = (values) => {
-        let osCPUFragment = '';
-        if (values.architecture == 'x86' && values.bitness == '64') {
-            osCPUFragment = '; Win64; x64';
+        this.onSelect.emit(event);
+        if (this.options && this.options.length > 0) {
+            this.selectButton(event);
         }
-        else if (values.architecture == 'arm') {
-            osCPUFragment = '; ARM';
+    }
+    selectButton(event) {
+        this.opened = !this.opened;
+        if (event && event.srcElement && event.srcElement.offsetWidth) {
+            this._menuWidth = event.srcElement.offsetWidth;
         }
-        else if (values.wow64 === true) {
-            osCPUFragment = '; WOW64';
+        if (this.opened) {
+            this.#subscription = new Subscription();
+            this.#subscription.add(fromEvent(window, 'scroll', { capture: true }).subscribe(() => {
+                if (event && event.target && event.target.id && (event.target.id === this.id || event.target.id === this.bizyMenuOptionsId)) {
+                    return;
+                }
+                this.opened = false;
+                this.#ref.detectChanges();
+                this.#subscription.unsubscribe();
+            }));
+            if (this.options) {
+                this.options.forEach((option) => {
+                    this.#subscription.add(option.onSelect.subscribe(event => {
+                        this.close(event);
+                    }));
+                });
+            }
         }
-        return `Windows NT ${getWindowsPlatformVersion(values.platformVersion)}${osCPUFragment}`;
-    };
-    const GetMacSpecificString = (values) => {
-        let newUA = 'Macintosh;';
-        newUA += values.architecture === 'arm' ? ' ARM ' : ' Intel ';
-        newUA += 'Mac OS X ';
-        let macVersion = values.platformVersion;
-        if (macVersion.indexOf('.') > -1) {
-            macVersion = macVersion.split('.').join('_');
+        else {
+            this.#subscription.unsubscribe();
         }
-        newUA += macVersion;
-        return newUA;
-    };
-    const GetAndroidSpecificString = (values) => {
-        let newUA = 'Linux; Android ';
-        newUA += values.platformVersion;
-        if (values.model) {
-            newUA += '; ';
-            newUA += values.model;
+    }
+    close = (event) => {
+        if (event && event.target && event.target.id && event.target.id === this.id) {
+            return;
         }
-        return newUA;
+        this.opened = false;
+        this.#subscription.unsubscribe();
+        this.#ref.detectChanges();
     };
-    const Initialize = (values) => {
-        if (!values.architecture) {
-            values.architecture = 'x86';
-        }
-        if (!values.bitness) {
-            values.bitness = '64';
-        }
-        if (!values.model) {
-            values.model = '';
-        }
-        if (!values.platform) {
-            values.platform = 'Windows';
-        }
-        if (!values.platformVersion) {
-            values.platformVersion = '10.0';
-        }
-        if (!values.wow64) {
-            values.wow64 = false;
-        }
-        return values;
-    };
-    // @ts-ignore-error
-    if (!navigator.userAgentData) {
-        return Promise.resolve('');
-    }
-    // Verify that this is a Chromium-based browser
-    let isChromium = false;
-    let chromiumVersion;
-    // eslint-disable-next-line prefer-regex-literals
-    const isChromeUAPattern = new RegExp('AppleWebKit/537.36 \\(KHTML, like Gecko\\) Chrome/\\d+.\\d+.\\d+.\\d+ (Mobile )?Safari/537.36$');
-    // @ts-ignore-error
-    navigator.userAgentData.brands.forEach(value => {
-        if (value.brand == 'Chromium') {
-            // Let's double check the UA string as well, so we don't accidentally
-            // capture a headless browser or friendly bot (which should report as
-            // HeadlessChrome or something entirely different).
-            isChromium = isChromeUAPattern.test(navigator.userAgent);
-            chromiumVersion = value.version;
-        }
-    });
-    // @ts-ignore
-    if (!isChromium || chromiumVersion < 100) {
-        // If this is not a Chromium-based browser, the UA string should be very
-        // different. Or, if this is a Chromium lower than 100, it doesn't have
-        // all the hints we rely on. So let's bail.
-        return Promise.resolve('');
-    }
-    // Main logic
-    return new Promise(resolve => {
-        // @ts-ignore-error
-        navigator.userAgentData.getHighEntropyValues(hints).then(values => {
-            let initialValues = {
-                // @ts-ignore-error
-                platform: navigator.userAgentData?.platform,
-                version: chromiumVersion
-            };
-            values = Object.assign(initialValues, values);
-            values = Initialize(values);
-            let newUA = 'Mozilla/5.0 (';
-            if (['Chrome OS', 'Chromium OS'].includes(values.platform)) {
-                newUA += GetCrosSpecificString(values);
-            }
-            else if (values.platform == 'Windows') {
-                newUA += GetWindowsSpecificString(values);
-            }
-            else if (values.platform == 'macOS') {
-                newUA += GetMacSpecificString(values);
-            }
-            else if (values.platform == 'Android') {
-                newUA += GetAndroidSpecificString(values);
-            }
-            else {
-                newUA += 'X11; Linux x86_64';
-            }
-            newUA += ') AppleWebKit/537.36 (KHTML, like Gecko) Chrome/';
-            newUA += getVersion(values?.fullVersionList, initialValues.version);
-            // @ts-ignore-error
-            if (navigator.userAgentData.mobile) {
-                newUA += ' Mobile';
-            }
-            newUA += ' Safari/537.36';
-            resolve(newUA);
-        });
-    });
-}
-function getVersion(fullVersionList, majorVersion) {
-    // If we don't get a fullVersionList, or it's somehow undefined, return
-    // the reduced version number.
-    return (fullVersionList?.find((item) => item.brand == 'Google Chrome')?.version ||
-        `${majorVersion}.0.0.0`);
-}
-function getWindowsPlatformVersion(platformVersion) {
-    // https://wicg.github.io/ua-client-hints/#get-the-legacy-windows-version-number
-    const versionMap = new Map([
-        ['0.3.0', '6.3'], // Windows 8.1
-        ['0.2.0', '6.2'], // Windows 8
-        ['0.1.0', '6.1'] // Windows 7
-    ]);
-    if (versionMap.has(platformVersion)) {
-        return versionMap.get(platformVersion);
+    ngOnDestroy() {
+        this.#subscription.unsubscribe();
     }
-    // Windows 10 and above send "Windows NT 10.0"
-    return '10.0';
-}
-/**
-   * @param {string[]} hints
-   * @return {Promise<string|undefined>} A Promise that resolves on overriding the
-   *   navigator.userAgent string.
-   */
-async function overrideUserAgentUsingClientHints(hints) {
-    return new Promise(resolve => {
-        getUserAgentUsingClientHints(hints).then(newUA => {
-            if (newUA) {
-                // Got a new UA value. Now override `navigator.userAgent`.
-                Object.defineProperty(navigator, 'userAgent', {
-                    value: newUA,
-                    writable: false,
-                    configurable: true
-                });
-            }
-            else {
-                newUA = navigator.userAgent;
-            }
-            resolve(newUA);
-        });
-    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyMenuComponent, isStandalone: true, selector: "bizy-menu", inputs: { id: "id", disabled: "disabled", offsetX: "offsetX", offsetY: "offsetY", customClass: "customClass", hideArrow: "hideArrow", opened: "opened" }, outputs: { onSelect: "onSelect" }, queries: [{ propertyName: "options", predicate: BizyMenuOptionComponent }], ngImport: i0, template: "<button \n    type=\"button\"\n    class=\"bizy-menu {{customClass}}\"\n    [ngClass]=\"{'bizy-menu--disabled': disabled}\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    cdkOverlayOrigin \n    #bizyMenuTrigger=\"cdkOverlayOrigin\">\n\n    <span class=\"bizy-menu__content\">\n        <ng-content></ng-content>\n    </span>\n    \n    <svg \n        class=\"bizy-menu__arrow\"\n        *ngIf=\"!hideArrow\" \n        viewBox=\"0 0 96 96\" \n        [ngClass]=\"{'bizy-menu__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M81.8457,25.3876a6.0239,6.0239,0,0,0-8.45.7676L48,56.6257l-25.396-30.47a5.999,5.999,0,1,0-9.2114,7.6879L43.3943,69.8452a5.9969,5.9969,0,0,0,9.2114,0L82.6074,33.8431A6.0076,6.0076,0,0,0,81.8457,25.3876Z\"/>\n    </svg>\n</button>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOffsetX]=\"offsetX\"\n    [cdkConnectedOverlayOffsetY]=\"offsetY\"\n    [cdkConnectedOverlayMinWidth]=\"_menuWidth\"\n    [cdkConnectedOverlayOrigin]=\"bizyMenuTrigger\"\n    (overlayOutsideClick)=\"close($event)\"\n    [cdkConnectedOverlayPush]=\"true\"\n    [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n    [cdkConnectedOverlayViewportMargin]=\"8\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-menu__options\" [id]=\"bizyMenuOptionsId\">\n\n        <span class=\"bizy-menu__options__header\">\n            <ng-content select=\"bizy-menu-title\"></ng-content>\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-content select=\"bizy-menu-option\"></ng-content>\n\n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu__options:empty) .bizy-menu>.bizy-menu__arrow{display:none!important}.bizy-menu{font-size:1rem;width:100%;border:none;background-color:transparent;display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:var(--bizy-menu-padding);color:var(--bizy-menu-color);cursor:pointer}.bizy-menu--disabled{pointer-events:none;opacity:.5;cursor:not-allowed!important}.bizy-menu__arrow{height:var(--bizy-menu-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-menu-color)}.bizy-menu__arrow--opened{transform:rotate(180deg)}.bizy-menu__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;pointer-events:none}.bizy-menu__options{background-color:var(--bizy-menu-background-color);min-width:var(--bizy-menu-min-width);max-width:var(--bizy-menu-max-width);max-height:var(--bizy-menu-max-height);overflow-y:auto;overflow-x:hidden;width:100%;display:flex;flex-direction:column;position:relative;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014}.bizy-menu__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-menu__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-menu-scroll-bar-color)}.bizy-menu__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-menu-scroll-bar-hover-color)}.bizy-menu__options::-webkit-scrollbar-button{height:1rem}.bizy-menu__options__header{position:sticky;z-index:1;top:0;display:flex;flex-direction:column;row-gap:.3rem;background-color:#fff}::ng-deep .bizy-menu__options__header{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2$2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-const exportedForTests = { getVersion, getWindowsPlatformVersion };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-menu', imports: [CommonModule, FormsModule, OverlayModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n    type=\"button\"\n    class=\"bizy-menu {{customClass}}\"\n    [ngClass]=\"{'bizy-menu--disabled': disabled}\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    cdkOverlayOrigin \n    #bizyMenuTrigger=\"cdkOverlayOrigin\">\n\n    <span class=\"bizy-menu__content\">\n        <ng-content></ng-content>\n    </span>\n    \n    <svg \n        class=\"bizy-menu__arrow\"\n        *ngIf=\"!hideArrow\" \n        viewBox=\"0 0 96 96\" \n        [ngClass]=\"{'bizy-menu__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M81.8457,25.3876a6.0239,6.0239,0,0,0-8.45.7676L48,56.6257l-25.396-30.47a5.999,5.999,0,1,0-9.2114,7.6879L43.3943,69.8452a5.9969,5.9969,0,0,0,9.2114,0L82.6074,33.8431A6.0076,6.0076,0,0,0,81.8457,25.3876Z\"/>\n    </svg>\n</button>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOffsetX]=\"offsetX\"\n    [cdkConnectedOverlayOffsetY]=\"offsetY\"\n    [cdkConnectedOverlayMinWidth]=\"_menuWidth\"\n    [cdkConnectedOverlayOrigin]=\"bizyMenuTrigger\"\n    (overlayOutsideClick)=\"close($event)\"\n    [cdkConnectedOverlayPush]=\"true\"\n    [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n    [cdkConnectedOverlayViewportMargin]=\"8\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-menu__options\" [id]=\"bizyMenuOptionsId\">\n\n        <span class=\"bizy-menu__options__header\">\n            <ng-content select=\"bizy-menu-title\"></ng-content>\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-content select=\"bizy-menu-option\"></ng-content>\n\n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu__options:empty) .bizy-menu>.bizy-menu__arrow{display:none!important}.bizy-menu{font-size:1rem;width:100%;border:none;background-color:transparent;display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:var(--bizy-menu-padding);color:var(--bizy-menu-color);cursor:pointer}.bizy-menu--disabled{pointer-events:none;opacity:.5;cursor:not-allowed!important}.bizy-menu__arrow{height:var(--bizy-menu-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-menu-color)}.bizy-menu__arrow--opened{transform:rotate(180deg)}.bizy-menu__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;pointer-events:none}.bizy-menu__options{background-color:var(--bizy-menu-background-color);min-width:var(--bizy-menu-min-width);max-width:var(--bizy-menu-max-width);max-height:var(--bizy-menu-max-height);overflow-y:auto;overflow-x:hidden;width:100%;display:flex;flex-direction:column;position:relative;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014}.bizy-menu__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-menu__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-menu-scroll-bar-color)}.bizy-menu__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-menu-scroll-bar-hover-color)}.bizy-menu__options::-webkit-scrollbar-button{height:1rem}.bizy-menu__options__header{position:sticky;z-index:1;top:0;display:flex;flex-direction:column;row-gap:.3rem;background-color:#fff}::ng-deep .bizy-menu__options__header{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto}\n"] }]
+        }], propDecorators: { options: [{
+                type: ContentChildren,
+                args: [BizyMenuOptionComponent]
+            }], id: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], offsetX: [{
+                type: Input
+            }], offsetY: [{
+                type: Input
+            }], customClass: [{
+                type: Input
+            }], hideArrow: [{
+                type: Input
+            }], opened: [{
+                type: Input
+            }], onSelect: [{
+                type: Output
+            }] } });
 
-class BizyDeviceService {
-    #device = inject(DeviceDetectorService);
-    async getUserAgent() {
-        try {
-            const userAgent = await overrideUserAgentUsingClientHints([
-                'architecture',
-                'bitness',
-                'model',
-                'platformVersion',
-                'uaFullVersion',
-                'fullVersionList'
-            ]);
-            return userAgent;
-        }
-        catch {
-            return window.navigator.userAgent;
-        }
-    }
-    isMobile = () => this.#device.isMobile();
-    isTablet = () => this.#device.isTablet();
-    isDesktop = () => this.#device.isDesktop();
-    isPortrait = () => this.#device.orientation === 'portrait';
-    isLandscape = () => this.#device.orientation === 'landscape';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyDeviceService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyDeviceService, providedIn: 'root' });
+class BizyMenuTitleComponent {
+    customClass = '';
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyMenuTitleComponent, isStandalone: true, selector: "bizy-menu-title", inputs: { customClass: "customClass" }, ngImport: i0, template: "<span class=\"bizy-menu-title {{customClass}}\">\n    <ng-content></ng-content>\n</span>\n", styles: [":host{font-size:1rem}.bizy-menu-title{background-color:var(--bizy-menu-title-background-color);color:var(--bizy-menu-title-color);padding:.5rem;cursor:default;text-decoration:underline .1rem var(--bizy-menu-title-underline-color);text-underline-offset:.3rem;display:flex;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyDeviceService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuTitleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizy-menu-title', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"bizy-menu-title {{customClass}}\">\n    <ng-content></ng-content>\n</span>\n", styles: [":host{font-size:1rem}.bizy-menu-title{background-color:var(--bizy-menu-title-background-color);color:var(--bizy-menu-title-color);padding:.5rem;cursor:default;text-decoration:underline .1rem var(--bizy-menu-title-underline-color);text-underline-offset:.3rem;display:flex;align-items:center}\n"] }]
+        }], propDecorators: { customClass: [{
+                type: Input
+            }] } });
 
-const SERVICES = [
-    BizyAnimationService,
-    BizyDeviceService,
-    BizyCacheService,
-    BizyCopyToClipboardService,
-    BizyExportToCSVService,
-    BizyFormatSecondsService,
-    BizyKeyboardService,
-    BizyLogService,
-    BizyRouterService,
-    BizyStorageService,
-    BizyValidatorService,
-    BizyViewportService
+const COMPONENTS$d = [
+    BizyMenuComponent,
+    BizyMenuOptionComponent,
+    BizyMenuTitleComponent
 ];
-class BizyServicesModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule, providers: SERVICES });
+class BizyMenuModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, imports: [BizyMenuComponent,
+            BizyMenuOptionComponent,
+            BizyMenuTitleComponent], exports: [BizyMenuComponent,
+            BizyMenuOptionComponent,
+            BizyMenuTitleComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, imports: [BizyMenuComponent,
+            BizyMenuOptionComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, decorators: [{
             type: NgModule,
             args: [{
-                    providers: SERVICES
+                    imports: COMPONENTS$d,
+                    exports: COMPONENTS$d,
                 }]
         }] });
 
-class BizyFilterPipe {
-    validator = inject(BizyValidatorService);
-    transform(items, property, states) {
-        if (!items || items.length === 0) {
-            return [];
-        }
-        if (!property || typeof states === 'undefined' || states === null) {
-            return items;
-        }
-        if (!Array.isArray(states)) {
-            return items.filter(_item => _item[property] === states);
-        }
-        if (states.length === 0) {
-            return items;
-        }
-        const _selected = states.filter(_state => _state.selected);
-        if (_selected.length === states.length) {
-            return items;
-        }
-        let output = [];
-        states.forEach(state => {
-            if (!state.selected) {
-                return;
-            }
-            const res = items.filter(_item => {
-                let _state = _item;
-                const nestedProperty = property.split('.');
-                nestedProperty.forEach(_property => {
-                    _state = _state[_property];
-                });
-                if (typeof state.id === 'boolean') {
-                    return Boolean(_state) === state.id;
-                }
-                if (Array.isArray(_state)) {
-                    return _state.includes(state.id);
-                }
-                return _state === state.id;
-            });
-            output = output.concat(res);
-        });
-        function deepEqual(a, b, seen = new WeakMap()) {
-            if (a === b)
-                return true;
-            if (typeof a !== "object" || typeof b !== "object" || a === null || b === null)
-                return false;
-            // Circular reference check
-            if (seen.has(a))
-                return seen.get(a) === b;
-            seen.set(a, b);
-            const aKeys = Object.keys(a);
-            const bKeys = Object.keys(b);
-            if (aKeys.length !== bKeys.length)
-                return false;
-            for (let key of aKeys) {
-                if (!bKeys.includes(key))
-                    return false;
-                if (!deepEqual(a[key], b[key], seen))
-                    return false;
-            }
-            return true;
-        }
-        function uniqueObjects(items) {
-            return items.filter((obj, index, self) => index === self.findIndex(other => deepEqual(obj, other)));
-        }
-        return uniqueObjects(output);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterPipe, isStandalone: true, name: "bizyFilter" });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'bizyFilter'
-                }]
-        }] });
-
-class BizyRangeFilterPipe {
-    transform(items, property, range) {
-        if (!items || items.length === 0) {
-            return [];
-        }
-        if (!property || !range) {
-            return items;
-        }
-        const min = range.min ?? null;
-        const max = range.max ?? null;
-        let itemsWithoutProperty = [];
-        const output = items.filter(_item => {
-            let _value = _item;
-            const nestedProperty = property.split('.');
-            for (let i = 0; i < nestedProperty.length; i++) {
-                const _property = nestedProperty[i];
-                if (typeof _value[_property] === 'undefined' || _value[_property] === null) {
-                    itemsWithoutProperty.push(_item);
-                    return false;
-                }
-                _value = _value[_property];
-            }
-            if (isNaN(_value)) {
-                return false;
-            }
-            return (min === null || _value >= min) && (max === null || _value <= max);
-        });
-        return itemsWithoutProperty.length === items.length ? items : output;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRangeFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyRangeFilterPipe, isStandalone: true, name: "bizyRangeFilter" });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRangeFilterPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'bizyRangeFilter'
-                }]
-        }] });
-
-const COMPONENTS$i = [
-    BizyFilterComponent,
-    BizyFilterSectionComponent,
-    BizyFilterContentComponent,
-    BizyFilterSectionCheckboxOptionComponent,
-    BizyFilterSectionRangeOptionComponent,
-    BizyFilterSectionSearchOptionComponent,
-    BizyFilterSectionsComponent
-];
-const PIPES$1 = [
-    BizyFilterPipe,
-    BizyRangeFilterPipe
-];
-class BizyFilterModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, imports: [BizyFilterComponent,
-            BizyFilterSectionComponent,
-            BizyFilterContentComponent,
-            BizyFilterSectionCheckboxOptionComponent,
-            BizyFilterSectionRangeOptionComponent,
-            BizyFilterSectionSearchOptionComponent,
-            BizyFilterSectionsComponent, BizyFilterPipe,
-            BizyRangeFilterPipe], exports: [BizyFilterComponent,
-            BizyFilterSectionComponent,
-            BizyFilterContentComponent,
-            BizyFilterSectionCheckboxOptionComponent,
-            BizyFilterSectionRangeOptionComponent,
-            BizyFilterSectionSearchOptionComponent,
-            BizyFilterSectionsComponent, BizyFilterPipe,
-            BizyRangeFilterPipe] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, providers: PIPES$1, imports: [BizyFilterComponent,
-            BizyFilterSectionComponent,
-            BizyFilterSectionCheckboxOptionComponent,
-            BizyFilterSectionRangeOptionComponent,
-            BizyFilterSectionSearchOptionComponent] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFilterModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: COMPONENTS$i.concat(PIPES$1),
-                    exports: COMPONENTS$i.concat(PIPES$1),
-                    providers: PIPES$1
-                }]
-        }] });
-
-class BizySelectOptionComponent {
+const EMPTY_CHART = [0];
+const MIN_CHART_SIZE = 350; // px;
+class BizyPieChartComponent {
     elementRef;
+    document;
     ref;
-    id = `bizy-select-option-${Math.random()}`;
-    disabled = false;
-    customClass = '';
-    onSelect = new EventEmitter();
-    set selected(selected) {
-        if (typeof selected === 'undefined' || selected === null) {
-            return;
-        }
-        this.#selected.next(selected);
-    }
-    #selected = new BehaviorSubject(false);
-    get selected$() {
-        return this.#selected.asObservable();
-    }
-    constructor(elementRef, ref) {
-        this.elementRef = elementRef;
-        this.ref = ref;
-    }
-    _onSelect() {
-        if (this.disabled) {
-            return;
-        }
-        this.onSelect.emit();
-        this.ref.detectChanges();
-    }
-    getId = () => {
-        return this.id;
-    };
-    getSelected = () => {
-        return this.#selected.value;
-    };
-    getValue = () => {
-        const value = this.elementRef?.nativeElement?.firstChild?.children[0]?.innerText;
-        return value ?? '';
-    };
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectOptionComponent, deps: [{ token: ElementRef }, { token: ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizySelectOptionComponent, isStandalone: true, selector: "bizy-select-option", inputs: { id: "id", disabled: "disabled", customClass: "customClass", selected: "selected" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect()\"\n    (keyup.enter)=\"_onSelect()\"\n    [ngClass]=\"{'bizy-select-option--selected': (selected$ | async), 'bizy-select-option--disabled': disabled}\"\n    class=\"bizy-select-option {{customClass}}\">\n\n    <span class=\"bizy-select-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>", styles: [":host{font-size:1rem}.bizy-select-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-select-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-select-option-color);cursor:pointer}.bizy-select-option:hover{background-color:var(--bizy-select-option-hover-background-color)}.bizy-select-option--selected{background-color:var(--bizy-select-option-selected-background-color)!important}.bizy-select-option--selected ::ng-deep .bizy-select-option__content *{color:var(--bizy-select-option-selected-color)}.bizy-select-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-select-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;text-align:start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectOptionComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-select-option', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect()\"\n    (keyup.enter)=\"_onSelect()\"\n    [ngClass]=\"{'bizy-select-option--selected': (selected$ | async), 'bizy-select-option--disabled': disabled}\"\n    class=\"bizy-select-option {{customClass}}\">\n\n    <span class=\"bizy-select-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>", styles: [":host{font-size:1rem}.bizy-select-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-select-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-select-option-color);cursor:pointer}.bizy-select-option:hover{background-color:var(--bizy-select-option-hover-background-color)}.bizy-select-option--selected{background-color:var(--bizy-select-option-selected-background-color)!important}.bizy-select-option--selected ::ng-deep .bizy-select-option__content *{color:var(--bizy-select-option-selected-color)}.bizy-select-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-select-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;text-align:start}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ElementRef, decorators: [{
-                    type: Inject,
-                    args: [ElementRef]
-                }] }, { type: i0.ChangeDetectorRef, decorators: [{
-                    type: Inject,
-                    args: [ChangeDetectorRef]
-                }] }], propDecorators: { id: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], customClass: [{
-                type: Input
-            }], onSelect: [{
-                type: Output
-            }], selected: [{
-                type: Input
-            }] } });
-
-class BizySelectComponent {
-    ref;
-    #viewContainerRef = inject(ViewContainerRef);
-    templatePortalContent;
-    options;
-    bizyInput;
-    id = `bizy-select-${Math.random()}`;
-    disabled = false;
-    readonly = false;
-    placeholder = '';
-    customClass = '';
-    opened = false;
-    openedChange = new EventEmitter();
+    renderer;
+    resizeRef = null;
+    tooltip = true;
+    type = 'pie';
+    download = { hide: false, label: 'Descargar', name: 'Bizy' };
+    onLabelFormatter;
+    onTooltipFormatter;
     onSelect = new EventEmitter();
-    onOpen = new EventEmitter();
-    _optionValue = '';
-    optionPortal;
-    templatePortal = null;
+    onDownload = new EventEmitter();
+    #echarts = null;
+    #mutationObserver = null;
+    #resizeObserver = null;
     #subscription = new Subscription();
-    #contentChildrenSubscription = new Subscription();
-    constructor(ref) {
+    #chartContainer = null;
+    #afterViewInit = new BehaviorSubject(false);
+    #resize$ = new Subject();
+    #data = EMPTY_CHART;
+    constructor(elementRef, document, ref, renderer) {
+        this.elementRef = elementRef;
+        this.document = document;
         this.ref = ref;
-    }
-    get touched() {
-        return this.bizyInput ? this.bizyInput.touched : false;
+        this.renderer = renderer;
     }
     ngAfterViewInit() {
-        this.templatePortal = new TemplatePortal(this.templatePortalContent, this.#viewContainerRef);
-        this._optionValue = '';
-        const option = this.options.find(_option => _option.getSelected());
-        if (option) {
-            this._optionValue = option.getValue();
-        }
-        this.options.forEach(_option => {
-            this.#subscription.add(_option.onSelect.subscribe(() => {
-                this.close();
-                this.ref.detectChanges();
-            }));
-            this.#subscription.add(_option.selected$.pipe(filter(_value => _value === true)).subscribe(() => {
-                this._optionValue = _option.getValue();
-                this.ref.detectChanges();
-            }));
+        this.#mutationObserver = new MutationObserver(() => {
+            if (this.elementRef && this.elementRef.nativeElement && (this.elementRef.nativeElement.offsetWidth || this.elementRef.nativeElement.offsetHeight)) {
+                this.#afterViewInit.next(true);
+                this.#mutationObserver.disconnect();
+            }
         });
-        this.#contentChildrenSubscription.add(this.options.changes.subscribe(() => {
-            this.#subscription.unsubscribe();
-            this.#subscription = new Subscription();
-            this.options.forEach(_option => {
-                this.#subscription.add(_option.onSelect.subscribe(() => {
-                    this.close();
-                    this.ref.detectChanges();
-                }));
-                this.#subscription.add(_option.selected$.pipe(filter(_value => _value === true)).subscribe(() => {
-                    this._optionValue = _option.getValue();
-                    this.ref.detectChanges();
-                }));
-            });
-        }));
-        this.ref.detectChanges();
+        this.#mutationObserver.observe(this.document.body, { childList: true, subtree: true });
     }
-    _onOpen(event) {
-        if (this.disabled || this.readonly) {
+    set data(data) {
+        if (!data) {
             return;
         }
-        this.opened = !this.opened;
-        this.onSelect.emit(event);
-        this.openedChange.emit(this.opened);
-        this.onOpen.emit(this.opened);
-        if (this.bizyInput) {
-            this.bizyInput.setFocus(true);
+        if (data.length > 0) {
+            this.#setChartData(data);
+        }
+        else {
+            this.#deleteChartContainer();
+            this.#setChartData(EMPTY_CHART);
         }
-        this.ref.detectChanges();
     }
-    close = (event, select) => {
-        if (select && event && event.target && event.target === select.bizyInputWrapper.nativeElement) {
+    async #setChartData(data) {
+        this.#subscription.add(this.#afterViewInit.pipe(filter(value => value === true), take(1)).subscribe(() => {
+            this.#createChartContainer();
+            if (!this.#chartContainer) {
+                return;
+            }
+            if (data && data.length > 0 && data[0] !== 0) {
+                this.#data = [];
+                data.forEach(_d => {
+                    if (!_d.value) {
+                        _d.value = 0;
+                    }
+                    if (!_d.name) {
+                        _d.name = '---';
+                    }
+                    const itemStyle = _d.color ? { color: _d.color } : {};
+                    this.#data.push({
+                        name: _d.name,
+                        value: _d.value,
+                        itemStyle
+                    });
+                });
+            }
+            else {
+                this.#data = EMPTY_CHART;
+            }
+            const itemStyle = this.type === 'pie' ? {
+                emphasis: {
+                    label: {
+                        show: true
+                    }
+                },
+                normal: {
+                    label: {
+                        position: 'outer',
+                        formatter: this.onLabelFormatter
+                    },
+                    labelLine: {
+                        show: true
+                    }
+                }
+            } :
+                {
+                    borderRadius: 10,
+                    borderColor: '#fff',
+                    borderWidth: 2
+                };
+            const label = this.type === 'pie' ? undefined : { show: false, position: 'center' };
+            const series = [{
+                    type: 'pie',
+                    radius: this.type === 'pie' ? '50%' : ['40%', '55%'],
+                    center: ['50%', '50%'],
+                    data: this.#data,
+                    itemStyle,
+                    label
+                }];
+            const textColor = getComputedStyle(this.document.documentElement).getPropertyValue('--bizy-tooltip-color') ?? '#000';
+            const textBackgroundColor = getComputedStyle(this.document.documentElement).getPropertyValue('--bizy-tooltip-background-color') ?? '#fff';
+            const borderColor = getComputedStyle(this.document.documentElement).getPropertyValue('--bizy-tooltip-border-color') ?? '#fff';
+            const toolbox = {
+                show: true,
+                feature: {
+                    mySaveAsImage: {
+                        show: !this.download.hide,
+                        icon: 'path://M288 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 242.7-73.4-73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l128 128c12.5 12.5 32.8 12.5 45.3 0l128-128c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L288 274.7 288 32zM64 352c-35.3 0-64 28.7-64 64l0 32c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-32c0-35.3-28.7-64-64-64l-101.5 0-45.3 45.3c-25 25-65.5 25-90.5 0L165.5 352 64 352zm368 56a24 24 0 1 1 0 48 24 24 0 1 1 0-48z',
+                        title: this.download.label,
+                        onclick: () => {
+                            setTimeout(() => {
+                                html2canvas(this.#chartContainer).then(canvas => {
+                                    var link = document.createElement('a');
+                                    link.href = canvas.toDataURL('image/png');
+                                    link.download = `${this.download.name}.png`;
+                                    this.renderer.appendChild(this.document.body, link);
+                                    link.click();
+                                    this.renderer.removeChild(this.document.body, link);
+                                    this.onDownload.emit();
+                                });
+                            }, 500);
+                        }
+                    }
+                },
+                emphasis: {
+                    iconStyle: {
+                        color: textColor,
+                        borderColor,
+                        borderWidth: 1,
+                        textBackgroundColor,
+                        textPadding: 5,
+                    }
+                }
+            };
+            const tooltip = {
+                show: this.tooltip,
+                trigger: 'item',
+                appendToBody: true,
+                formatter: this.onTooltipFormatter
+            };
+            const legend = this.type === 'pie' ? { show: false } : { show: true, orient: 'vertical', left: 'left' };
+            const option = {
+                tooltip,
+                toolbox,
+                legend,
+                series
+            };
+            this.#echarts = echarts.init(this.#chartContainer);
+            this.#echarts.setOption(option);
+            this.#echarts.on('click', params => {
+                this.onSelect.emit(params.name);
+            });
+            this.#resizeObserver = new ResizeObserver(() => this.#resize$.next());
+            const resizeRef = this.resizeRef ? this.resizeRef : this.renderer.parentNode(this.elementRef.nativeElement) ? this.renderer.parentNode(this.elementRef.nativeElement) : this.elementRef.nativeElement;
+            this.#resizeObserver.observe(resizeRef);
+            this.#subscription.add(this.#resize$.pipe(skip(1), auditTime(300), throttleTime(500)).subscribe(() => {
+                this.#deleteChartContainer();
+                this.#createChartContainer();
+                if (!this.#chartContainer) {
+                    return;
+                }
+                this.#echarts = echarts.init(this.#chartContainer);
+                this.#echarts.setOption({ ...option, series: option.series.map(_serie => { return { ..._serie, data: this.#data }; }) });
+                this.#echarts.on('click', params => {
+                    this.onSelect.emit(params.name);
+                });
+            }));
+        }));
+    }
+    #createChartContainer = () => {
+        if (this.#chartContainer || !this.elementRef || !this.elementRef.nativeElement) {
             return;
         }
-        this.opened = false;
-        this.openedChange.emit(this.opened);
-        this.onOpen.emit(this.opened);
+        let elementWidth = this.elementRef.nativeElement.offsetWidth || MIN_CHART_SIZE;
+        let elementHeight = this.elementRef.nativeElement.offsetHeight || MIN_CHART_SIZE;
+        let minWidth = MIN_CHART_SIZE;
+        let minHeight = MIN_CHART_SIZE;
+        const chartMinWidth = getComputedStyle(this.document.body).getPropertyValue('--bizy-chart-min-width');
+        const pieChartMinHeight = getComputedStyle(this.document.body).getPropertyValue('--bizy-chart-min-height');
+        if (Number(chartMinWidth)) {
+            minWidth = Number(chartMinWidth);
+        }
+        if (Number(pieChartMinHeight)) {
+            minHeight = Number(pieChartMinHeight);
+        }
+        const width = Math.max(elementWidth, minWidth);
+        const height = Math.max(elementHeight, minHeight);
+        this.#chartContainer = this.renderer.createElement('div');
+        this.renderer.setStyle(this.#chartContainer, 'width', `${width}px`);
+        this.renderer.setStyle(this.#chartContainer, 'height', `${height}px`);
+        this.renderer.appendChild(this.elementRef.nativeElement, this.#chartContainer);
         this.ref.detectChanges();
     };
-    setTouched(touched) {
-        if (this.bizyInput) {
-            this.bizyInput.setTouched(touched);
-            this.ref.detectChanges();
+    #deleteChartContainer = () => {
+        if (!this.#chartContainer || !this.elementRef || !this.elementRef.nativeElement) {
+            return;
         }
-    }
+        this.#echarts.clear();
+        this.renderer.removeChild(this.elementRef.nativeElement, this.#chartContainer);
+        this.#chartContainer = null;
+        this.ref.detectChanges();
+    };
     ngOnDestroy() {
         this.#subscription.unsubscribe();
-        this.#contentChildrenSubscription.unsubscribe();
+        if (this.#mutationObserver) {
+            this.#mutationObserver.disconnect();
+        }
+        if (this.#resizeObserver) {
+            this.#resizeObserver.disconnect();
+        }
+        if (this.#echarts) {
+            this.#echarts.clear();
+        }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectComponent, deps: [{ token: ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizySelectComponent, isStandalone: true, selector: "bizy-select", inputs: { id: "id", disabled: "disabled", readonly: "readonly", placeholder: "placeholder", customClass: "customClass", opened: "opened" }, outputs: { openedChange: "openedChange", onSelect: "onSelect", onOpen: "onOpen" }, queries: [{ propertyName: "options", predicate: BizySelectOptionComponent }], viewQueries: [{ propertyName: "templatePortalContent", first: true, predicate: ["templatePortalContent"], descendants: true }, { propertyName: "bizyInput", first: true, predicate: ["bizyInput"], descendants: true }], ngImport: i0, template: "<bizy-input\n    #bizyInput\n    [readonly]=\"true\"\n    [disabled]=\"disabled\"\n    [id]=\"id\"\n    [placeholder]=\"placeholder\"\n    [value]=\"_optionValue\"\n    [ngClass]=\"{'bizy-select--readonly': readonly}\"\n    (onSelect)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    (onEnter)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    class=\"bizy-select {{customClass}}\"\n    cdkOverlayOrigin\n    #bizySelectTrigger=\"cdkOverlayOrigin\">\n\n    <svg \n        slot=\"suffix\"\n        id=\"bizy-select-arrow\"\n        *ngIf=\"!readonly\"\n        class=\"bizy-select__arrow\"\n        [ngClass]=\"{'bizy-select__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 320 512\">\n        <path d=\"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\"/>\n    </svg>\n\n    <ng-container slot=\"header\">\n        <ng-content select=\"[slot=header]\"></ng-content>\n    </ng-container>\n\n    <ng-container slot=\"prefix\">\n        <ng-content select=\"[slot=prefix]\"></ng-content>\n    </ng-container>\n\n</bizy-input>\n\n<span class=\"bizy-select__errors\" *ngIf=\"touched\">\n    <ng-content select=\"[slot=error]\"></ng-content>\n</span>\n\n<ng-template #templatePortalContent>\n    <ng-content select=\"bizy-select-option\"></ng-content>\n</ng-template>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayMinWidth]=\"bizyInput.getWidth()\"\n    [cdkConnectedOverlayOrigin]=\"bizySelectTrigger\"\n    (overlayOutsideClick)=\"close($event, bizyInput)\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-select__options\">\n\n        <span class=\"bizy-select__options__search\">\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-template [cdkPortalOutlet]=\"templatePortal\"></ng-template>\n    \n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem;width:var(--bizy-select-width);min-width:var(--bizy-select-min-width);max-width:var(--bizy-select-max-width);display:flex;flex-direction:column;row-gap:.3rem;--bizy-input-focus-color: transparent}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__bottom-line{background-color:var(--bizy-input-invalid-color)!important;visibility:visible!important}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__content__input{color:var(--bizy-input-invalid-color)!important}.bizy-select{--bizy-input-cursor: pointer;--bizy-input-background-color: var(--bizy-select-background-color);--bizy-input-color: var(--bizy-select-color)}.bizy-select--readonly{--bizy-input-cursor: default}.bizy-select__arrow{height:var(--bizy-select-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-select-color)}.bizy-select__arrow--opened{transform:rotate(180deg)}.bizy-select__options{background-color:var(--bizy-select-background-color);display:flex;min-width:fit-content;width:100%;flex-direction:column;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014;max-height:var(--bizy-select-height);overflow-y:auto;overflow-x:hidden;position:relative}.bizy-select__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-select__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-select-scroll-bar-color)}.bizy-select__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-select-scroll-bar-hover-color)}.bizy-select__options::-webkit-scrollbar-button{height:1rem}.bizy-select__options__search{position:sticky;z-index:1;top:0}::ng-deep .bizy-select__options__search{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto;margin-bottom:.3rem}.bizy-select__errors:empty{display:none!important}::ng-deep .bizy-select__errors *{color:var(--bizy-input-invalid-color)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "type", "customClass", "placeholder", "debounceTime", "rows", "disabled", "readonly", "autofocus", "value"], outputs: ["valueChange", "onChange", "onEnter", "onBackspace", "onSelect", "onBlur", "onFocus"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2$2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartComponent, deps: [{ token: ElementRef }, { token: DOCUMENT }, { token: ChangeDetectorRef }, { token: Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyPieChartComponent, isStandalone: true, selector: "bizy-pie-chart", inputs: { resizeRef: "resizeRef", tooltip: "tooltip", type: "type", download: "download", onLabelFormatter: "onLabelFormatter", onTooltipFormatter: "onTooltipFormatter", data: "data" }, outputs: { onSelect: "onSelect", onDownload: "onDownload" }, ngImport: i0, template: '', isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizySelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizy-select', imports: [CommonModule, BizyInputComponent, OverlayModule, PortalModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<bizy-input\n    #bizyInput\n    [readonly]=\"true\"\n    [disabled]=\"disabled\"\n    [id]=\"id\"\n    [placeholder]=\"placeholder\"\n    [value]=\"_optionValue\"\n    [ngClass]=\"{'bizy-select--readonly': readonly}\"\n    (onSelect)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    (onEnter)=\"_onOpen($event); bizyInput?.setTouched(true)\"\n    class=\"bizy-select {{customClass}}\"\n    cdkOverlayOrigin\n    #bizySelectTrigger=\"cdkOverlayOrigin\">\n\n    <svg \n        slot=\"suffix\"\n        id=\"bizy-select-arrow\"\n        *ngIf=\"!readonly\"\n        class=\"bizy-select__arrow\"\n        [ngClass]=\"{'bizy-select__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 320 512\">\n        <path d=\"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\"/>\n    </svg>\n\n    <ng-container slot=\"header\">\n        <ng-content select=\"[slot=header]\"></ng-content>\n    </ng-container>\n\n    <ng-container slot=\"prefix\">\n        <ng-content select=\"[slot=prefix]\"></ng-content>\n    </ng-container>\n\n</bizy-input>\n\n<span class=\"bizy-select__errors\" *ngIf=\"touched\">\n    <ng-content select=\"[slot=error]\"></ng-content>\n</span>\n\n<ng-template #templatePortalContent>\n    <ng-content select=\"bizy-select-option\"></ng-content>\n</ng-template>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayMinWidth]=\"bizyInput.getWidth()\"\n    [cdkConnectedOverlayOrigin]=\"bizySelectTrigger\"\n    (overlayOutsideClick)=\"close($event, bizyInput)\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-select__options\">\n\n        <span class=\"bizy-select__options__search\">\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-template [cdkPortalOutlet]=\"templatePortal\"></ng-template>\n    \n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem;width:var(--bizy-select-width);min-width:var(--bizy-select-min-width);max-width:var(--bizy-select-max-width);display:flex;flex-direction:column;row-gap:.3rem;--bizy-input-focus-color: transparent}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__bottom-line{background-color:var(--bizy-input-invalid-color)!important;visibility:visible!important}:host:has(>.bizy-select__errors:not(:empty)) ::ng-deep .bizy-input__content__input{color:var(--bizy-input-invalid-color)!important}.bizy-select{--bizy-input-cursor: pointer;--bizy-input-background-color: var(--bizy-select-background-color);--bizy-input-color: var(--bizy-select-color)}.bizy-select--readonly{--bizy-input-cursor: default}.bizy-select__arrow{height:var(--bizy-select-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-select-color)}.bizy-select__arrow--opened{transform:rotate(180deg)}.bizy-select__options{background-color:var(--bizy-select-background-color);display:flex;min-width:fit-content;width:100%;flex-direction:column;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014;max-height:var(--bizy-select-height);overflow-y:auto;overflow-x:hidden;position:relative}.bizy-select__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-select__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-select-scroll-bar-color)}.bizy-select__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-select-scroll-bar-hover-color)}.bizy-select__options::-webkit-scrollbar-button{height:1rem}.bizy-select__options__search{position:sticky;z-index:1;top:0}::ng-deep .bizy-select__options__search{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto;margin-bottom:.3rem}.bizy-select__errors:empty{display:none!important}::ng-deep .bizy-select__errors *{color:var(--bizy-input-invalid-color)!important}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef, decorators: [{
+            args: [{
+                    selector: 'bizy-pie-chart',
+                    template: '',
+                    imports: [CommonModule],
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef, decorators: [{
+                    type: Inject,
+                    args: [ElementRef]
+                }] }, { type: Document, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }, { type: i0.ChangeDetectorRef, decorators: [{
                     type: Inject,
                     args: [ChangeDetectorRef]
-                }] }], propDecorators: { templatePortalContent: [{
-                type: ViewChild,
-                args: ['templatePortalContent']
-            }], options: [{
-                type: ContentChildren,
-                args: [BizySelectOptionComponent]
-            }], bizyInput: [{
-                type: ViewChild,
-                args: ['bizyInput']
-            }], id: [{
+                }] }, { type: i0.Renderer2, decorators: [{
+                    type: Inject,
+                    args: [Renderer2]
+                }] }], propDecorators: { resizeRef: [{
                 type: Input
-            }], disabled: [{
+            }], tooltip: [{
                 type: Input
-            }], readonly: [{
+            }], type: [{
                 type: Input
-            }], placeholder: [{
+            }], download: [{
                 type: Input
-            }], customClass: [{
+            }], onLabelFormatter: [{
                 type: Input
-            }], opened: [{
+            }], onTooltipFormatter: [{
                 type: Input
-            }], openedChange: [{
-                type: Output
             }], onSelect: [{
                 type: Output
-            }], onOpen: [{
+            }], onDownload: [{
                 type: Output
+            }], data: [{
+                type: Input
             }] } });
 
-class BizyFormComponent {
-    inputs;
-    selects;
-    datePickers;
-    id = `bizy-form-${Math.random()}`;
-    customClass = '';
-    onSubmit(event) {
-        this.setTouched();
-        event.preventDefault();
-    }
-    setTouched = () => {
-        if (this.inputs.length > 0) {
-            this.inputs.forEach(component => {
-                component.setTouched(true);
-            });
-        }
-        if (this.selects.length > 0) {
-            this.selects.forEach(component => {
-                component.setTouched(true);
-            });
+const COMPONENTS$c = [
+    BizyPieChartComponent,
+];
+class BizyPieChartModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, imports: [BizyPieChartComponent], exports: [BizyPieChartComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, imports: [COMPONENTS$c] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: COMPONENTS$c,
+                    exports: COMPONENTS$c,
+                }]
+        }] });
+
+class BizyPopupWrapperComponent {
+    dynamicComponentContainer;
+    #data = inject(DIALOG_DATA);
+    #dialogRef = inject(DialogRef);
+    #popup = inject(BizyPopupService);
+    #ref = inject(ChangeDetectorRef);
+    disabled = false;
+    disableClose = false;
+    disableDrag = false;
+    ngAfterViewInit() {
+        this.loadDynamicComponent();
+        if (this.#data && this.#data.disableClose) {
+            this.disableClose = this.#data.disableClose;
         }
-        if (this.datePickers.length > 0) {
-            this.datePickers.forEach(component => {
-                component.setTouched(true);
-            });
+        if (this.#data && this.#data.disableDrag) {
+            this.disableDrag = this.#data.disableDrag;
+        }
+    }
+    loadDynamicComponent = () => {
+        if (this.#data && this.#data.component) {
+            this.dynamicComponentContainer.clear();
+            this.dynamicComponentContainer.createComponent(this.#data.component);
+            this.#ref.detectChanges();
         }
     };
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyFormComponent, isStandalone: true, selector: "bizy-form", inputs: { id: "id", customClass: "customClass" }, queries: [{ propertyName: "inputs", predicate: BizyInputComponent, descendants: true }, { propertyName: "selects", predicate: BizySelectComponent, descendants: true }, { propertyName: "datePickers", predicate: BizyDatePickerComponent, descendants: true }], ngImport: i0, template: "<form class=\"bizy-form {{customClass}}\" [id]=\"id\" (ngSubmit)=\"onSubmit($event)\">\n    <ng-content></ng-content>\n</form>", styles: [":host{font-size:1rem;max-width:var(--bizy-form-max-width)}.bizy-form{max-width:inherit;display:flex;flex-direction:column;row-gap:var(--bizy-form-row-gap);--bizy-input-max-width: 100%;--bizy-select-max-width: 100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    async close() {
+        this.disabled = true;
+        this.#popup.close({ id: this.#dialogRef.id });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPopupWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyPopupWrapperComponent, isStandalone: true, selector: "bizy-popup-wrapper", viewQueries: [{ propertyName: "dynamicComponentContainer", first: true, predicate: ["dynamicComponentContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"bizy-popup-wrapper\" cdkDrag>\n\n    <button *ngIf=\"!disableDrag\" class=\"bizy-popup-wrapper__drag-button\" cdkDragHandle>\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" class=\"bizy-popup-wrapper__drag-button__icon\">\n            <path d=\"M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z\"/>\n        </svg>\n\n    </button>\n\n    <button *ngIf=\"!disableClose\" class=\"bizy-popup-wrapper__close-button\" (click)=\"close()\" (keyup.enter)=\"close()\">\n\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\" class=\"bizy-popup-wrapper__close-button__icon\">\n            <path d=\"M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z\"/>\n        </svg>\n\n    </button>\n\n    <ng-container #dynamicComponentContainer></ng-container>\n\n</div>", styles: [":host{font-size:1rem;position:fixed!important;inset:50%;transform:translate(-50%,-50%);min-height:150px;min-width:150px;width:fit-content;height:fit-content;z-index:10}.bizy-popup-wrapper{position:relative;padding:var(--bizy-popup-padding);background-color:var(--bizy-popup-background-color);min-width:var(--bizy-popup-min-width);width:var(--bizy-popup-width);max-width:var(--bizy-popup-max-width)}.bizy-popup-wrapper__drag-button{position:absolute;left:-.9rem;top:-.9rem;border:var(--bizy-popup-drag-button-border);border-radius:50%;padding:.2rem;place-items:center;display:grid;background-color:var(--bizy-popup-drag-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__drag-button:hover{transform:scale(1.1)}.bizy-popup-wrapper__drag-button__icon{height:1rem}.bizy-popup-wrapper__drag-button__icon{fill:var(--bizy-popup-drag-button-color)}.bizy-popup-wrapper__close-button{position:absolute;right:-.9rem;top:-.9rem;border:var(--bizy-popup-close-button-border);border-radius:50%;padding:.25rem .35rem;place-items:center;display:grid;background-color:var(--bizy-popup-close-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{transform:scale(1.1)}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-hover-color)}.bizy-popup-wrapper__close-button__icon{height:1rem;transition:fill .2s ease,}.bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPopupWrapperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizy-form', imports: [CommonModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form class=\"bizy-form {{customClass}}\" [id]=\"id\" (ngSubmit)=\"onSubmit($event)\">\n    <ng-content></ng-content>\n</form>", styles: [":host{font-size:1rem;max-width:var(--bizy-form-max-width)}.bizy-form{max-width:inherit;display:flex;flex-direction:column;row-gap:var(--bizy-form-row-gap);--bizy-input-max-width: 100%;--bizy-select-max-width: 100%}\n"] }]
-        }], propDecorators: { inputs: [{
-                type: ContentChildren,
-                args: [BizyInputComponent, { descendants: true }]
-            }], selects: [{
-                type: ContentChildren,
-                args: [BizySelectComponent, { descendants: true }]
-            }], datePickers: [{
-                type: ContentChildren,
-                args: [BizyDatePickerComponent, { descendants: true }]
-            }], id: [{
-                type: Input
-            }], customClass: [{
-                type: Input
+            args: [{ selector: 'bizy-popup-wrapper', imports: [CommonModule, DialogModule, DragDropModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bizy-popup-wrapper\" cdkDrag>\n\n    <button *ngIf=\"!disableDrag\" class=\"bizy-popup-wrapper__drag-button\" cdkDragHandle>\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" class=\"bizy-popup-wrapper__drag-button__icon\">\n            <path d=\"M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z\"/>\n        </svg>\n\n    </button>\n\n    <button *ngIf=\"!disableClose\" class=\"bizy-popup-wrapper__close-button\" (click)=\"close()\" (keyup.enter)=\"close()\">\n\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\" class=\"bizy-popup-wrapper__close-button__icon\">\n            <path d=\"M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z\"/>\n        </svg>\n\n    </button>\n\n    <ng-container #dynamicComponentContainer></ng-container>\n\n</div>", styles: [":host{font-size:1rem;position:fixed!important;inset:50%;transform:translate(-50%,-50%);min-height:150px;min-width:150px;width:fit-content;height:fit-content;z-index:10}.bizy-popup-wrapper{position:relative;padding:var(--bizy-popup-padding);background-color:var(--bizy-popup-background-color);min-width:var(--bizy-popup-min-width);width:var(--bizy-popup-width);max-width:var(--bizy-popup-max-width)}.bizy-popup-wrapper__drag-button{position:absolute;left:-.9rem;top:-.9rem;border:var(--bizy-popup-drag-button-border);border-radius:50%;padding:.2rem;place-items:center;display:grid;background-color:var(--bizy-popup-drag-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__drag-button:hover{transform:scale(1.1)}.bizy-popup-wrapper__drag-button__icon{height:1rem}.bizy-popup-wrapper__drag-button__icon{fill:var(--bizy-popup-drag-button-color)}.bizy-popup-wrapper__close-button{position:absolute;right:-.9rem;top:-.9rem;border:var(--bizy-popup-close-button-border);border-radius:50%;padding:.25rem .35rem;place-items:center;display:grid;background-color:var(--bizy-popup-close-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{transform:scale(1.1)}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-hover-color)}.bizy-popup-wrapper__close-button__icon{height:1rem;transition:fill .2s ease,}.bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-color)}\n"] }]
+        }], propDecorators: { dynamicComponentContainer: [{
+                type: ViewChild,
+                args: ['dynamicComponentContainer', { read: ViewContainerRef }]
             }] } });
 
-const COMPONENTS$h = [
-    BizyFormComponent,
-];
-class BizyFormModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, imports: [BizyFormComponent], exports: [BizyFormComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, imports: [COMPONENTS$h] });
+var BIZY_ANIMATION;
+(function (BIZY_ANIMATION) {
+    BIZY_ANIMATION["FADE_IN"] = "fade-in";
+    BIZY_ANIMATION["FADE_OUT"] = "fade-out";
+    BIZY_ANIMATION["FADE_IN_UP"] = "fade-in-up";
+    BIZY_ANIMATION["FADE_IN_RIGHT"] = "fade-in-right";
+    BIZY_ANIMATION["FADE_IN_DOWN"] = "fade-in-down";
+    BIZY_ANIMATION["FADE_IN_LEFT"] = "fade-in-left";
+    BIZY_ANIMATION["SLIDE_IN_UP"] = "slide-in-up";
+    BIZY_ANIMATION["SLIDE_IN_RIGHT"] = "slide-in-right";
+    BIZY_ANIMATION["SLIDE_IN_DOWN"] = "slide-in-down";
+    BIZY_ANIMATION["SLIDE_IN_LEFT"] = "slide-in-left";
+    BIZY_ANIMATION["SLIDE_OUT_UP"] = "slide-out-up";
+    BIZY_ANIMATION["SLIDE_OUT_DOWN"] = "slide-out-down";
+    BIZY_ANIMATION["SLIDE_OUT_RIGHT"] = "slide-out-right";
+    BIZY_ANIMATION["SLIDE_OUT_LEFT"] = "slide-out-left";
+})(BIZY_ANIMATION || (BIZY_ANIMATION = {}));
+class BizyAnimationService {
+    rendererFactory;
+    #renderer;
+    constructor(rendererFactory) {
+        this.rendererFactory = rendererFactory;
+        this.#renderer = this.rendererFactory.createRenderer(null, null);
+    }
+    setAnimation(element, animation) {
+        return new Promise(resolve => {
+            if (!element || !animation || !this.#renderer) {
+                return;
+            }
+            const root = this.#renderer.selectRootElement(':root', true);
+            const animationTimeout = getComputedStyle(root).getPropertyValue('--bizy-animation-timeout').trim();
+            this.#renderer.addClass(element, 'animated');
+            this.#renderer.addClass(element, animation);
+            setTimeout(() => {
+                this.#renderer.removeClass(element, 'animated');
+                this.#renderer.removeClass(element, animation);
+                resolve();
+            }, Number(animationTimeout.match(/\d/g).join('')));
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAnimationService, deps: [{ token: RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAnimationService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormModule, decorators: [{
-            type: NgModule,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAnimationService, decorators: [{
+            type: Injectable,
             args: [{
-                    imports: COMPONENTS$h,
-                    exports: COMPONENTS$h,
+                    providedIn: 'root'
                 }]
-        }] });
+        }], ctorParameters: () => [{ type: i0.RendererFactory2, decorators: [{
+                    type: Inject,
+                    args: [RendererFactory2]
+                }] }] });
 
-class BizyGridForDirective {
-    viewContainerRef = inject(ViewContainerRef);
-    templateRef = inject(TemplateRef);
-    #items = new BehaviorSubject([]);
-    get items$() {
-        return this.#items.asObservable();
+class BizyViewportService {
+    window;
+    #viewportSizeChanged;
+    get sizeChange$() {
+        return this.#viewportSizeChanged.asObservable();
     }
-    set gridForOf(items) {
-        this.#items.next(items);
+    constructor(window) {
+        this.window = window;
+        this.#viewportSizeChanged = new BehaviorSubject({
+            width: this.window.innerWidth,
+            height: this.window.innerHeight
+        });
+        fromEvent(window, 'resize')
+            .pipe(debounceTime(200), map((event) => ({
+            width: event.currentTarget.innerWidth,
+            height: event.currentTarget.innerHeight
+        })))
+            .subscribe(windowSize => {
+            this.#viewportSizeChanged.next(windowSize);
+        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridForDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: BizyGridForDirective, isStandalone: true, selector: "[gridFor]", inputs: { gridForOf: "gridForOf" }, ngImport: i0 });
+    width() {
+        return this.window.screen.availWidth;
+    }
+    height() {
+        return this.window.screen.availHeight;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyViewportService, deps: [{ token: Window }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyViewportService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridForDirective, decorators: [{
-            type: Directive,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyViewportService, decorators: [{
+            type: Injectable,
             args: [{
-                    selector: '[gridFor]',
+                    providedIn: 'root'
                 }]
-        }], propDecorators: { gridForOf: [{
-                type: Input,
-                args: ['gridForOf']
-            }] } });
-
-class BizyGridRowComponent {
-    #elementRef = inject(ElementRef);
-    #ref = inject(ChangeDetectorRef);
-    #renderer = inject(Renderer2);
-    rowHeight = 100; // Px
-    set itemsPerRow(itemsPerRow) {
-        if (!this.#elementRef.nativeElement) {
-            return;
-        }
-        if (!itemsPerRow) {
-            itemsPerRow = 1;
-        }
-        this.#renderer.setStyle(this.#elementRef.nativeElement, 'gridTemplateRows', `${this.rowHeight}px`);
-        this.#renderer.setStyle(this.#elementRef.nativeElement, 'gridTemplateColumns', `repeat(${itemsPerRow}, minmax(0, 1fr)`);
-        this.#ref.detectChanges();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyGridRowComponent, isStandalone: true, selector: "bizy-grid-row", inputs: { rowHeight: "rowHeight", itemsPerRow: "itemsPerRow" }, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;display:grid;column-gap:var(--bizy-grid-gap);margin-bottom:var(--bizy-grid-gap)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridRowComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-grid-row', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;display:grid;column-gap:var(--bizy-grid-gap);margin-bottom:var(--bizy-grid-gap)}\n"] }]
-        }], propDecorators: { rowHeight: [{
-                type: Input
-            }], itemsPerRow: [{
-                type: Input
-            }] } });
+        }], ctorParameters: () => [{ type: Window, decorators: [{
+                    type: Inject,
+                    args: [Window]
+                }] }] });
 
-class BizyGridComponent {
-    ref;
+class BizyKeyboardService {
     document;
-    renderer;
-    elementRef;
-    content;
-    gridDirective;
-    resizeRef = null;
-    #rowScrollingMutationObserver;
-    #resizeObserver;
-    #subscription = new Subscription();
-    #view;
-    notifier$ = new Subject();
-    rowHeight = 100;
-    itemRows = [];
-    items = [];
-    itemTemplate;
-    itemsPerRow = 1;
-    constructor(ref, document, renderer, elementRef) {
-        this.ref = ref;
-        this.document = document;
-        this.renderer = renderer;
-        this.elementRef = elementRef;
+    #shiftHolding = new BehaviorSubject(false);
+    #controlHolding = new BehaviorSubject(false);
+    get shiftHolding$() {
+        return this.#shiftHolding.asObservable();
     }
-    ngAfterContentInit() {
-        if (this.gridDirective) {
-            this.#initView();
-        }
-        else {
-            this.#rowScrollingMutationObserver = new MutationObserver(() => {
-                if (!this.gridDirective) {
-                    return;
-                }
-                this.#initView();
-                this.#rowScrollingMutationObserver.disconnect();
-                this.ref.detectChanges();
-            });
-            this.#rowScrollingMutationObserver.observe(this.document.body, { childList: true, subtree: true });
-        }
+    get controlHolding$() {
+        return this.#controlHolding.asObservable();
     }
-    #initView = () => {
-        this.#subscription.add(this.gridDirective.items$.subscribe(items => {
-            if (this.items.length === 0 && items.length === 0) {
-                return;
+    constructor(document) {
+        this.document = document;
+        this.document.addEventListener('visibilitychange', () => {
+            this.#shiftHolding.next(false);
+            this.#controlHolding.next(false);
+        });
+        this.document.addEventListener('keydown', (event) => {
+            if (event.key === 'Shift') {
+                this.#shiftHolding.next(true);
             }
-            this.items = items;
-            this.#updateView();
-        }));
-        if (!this.#view) {
-            this.#view = this.gridDirective.viewContainerRef;
-            this.#view.createEmbeddedView(this.content);
+            if (event.key === 'Meta' || event.key === 'Control') {
+                this.#controlHolding.next(true);
+            }
+        });
+        this.document.addEventListener('keyup', (event) => {
+            if (event.key === 'Shift') {
+                this.#shiftHolding.next(false);
+            }
+            if (event.key === 'Meta' || event.key === 'Control') {
+                this.#controlHolding.next(false);
+            }
+        });
+    }
+    isShiftHolding() {
+        return this.#shiftHolding.value;
+    }
+    isControlHolding() {
+        return this.#controlHolding.value;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyKeyboardService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyKeyboardService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyKeyboardService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: Document, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }] });
+
+class BizyExportToCSVService {
+    document;
+    rendererFactory;
+    #loading = false;
+    #renderer;
+    constructor(document, rendererFactory) {
+        this.document = document;
+        this.rendererFactory = rendererFactory;
+        this.#renderer = this.rendererFactory.createRenderer(null, null);
+    }
+    download(data) {
+        if (this.#loading || !data.items || !Array.isArray(data.items) || !data.model) {
+            return;
+        }
+        try {
+            this.#loading = true;
+            const csv = this.getCSV(data);
+            if (!data.fileName) {
+                data.fileName = 'bizy-csv';
+            }
+            this.#downloadCSV({ csv, fileName: data.fileName });
+        }
+        finally {
+            this.#loading = false;
+        }
+    }
+    getCSV(data) {
+        let csv = '';
+        function escapeCommas(str) {
+            return str.includes(',') ? `"${str}"` : str;
+        }
+        for (const key in data.model) {
+            if (key) {
+                csv += `${data.model[key]},`;
+            }
+        }
+        data.items.forEach(_item => {
+            // Remove the last character (',')
+            csv = csv.slice(0, -1);
+            csv += '\n';
+            for (const key in data.model) {
+                let value = _item;
+                const nestedProperty = key.split('.');
+                for (let i = 0; i < nestedProperty.length; i++) {
+                    const _property = nestedProperty[i];
+                    if (value) {
+                        value = value[_property];
+                    }
+                    else {
+                        break;
+                    }
+                }
+                if (typeof value !== undefined && value !== null) {
+                    csv += `${escapeCommas(String(value).replace(/\n/g, ''))},`;
+                }
+                else {
+                    csv += ',';
+                }
+            }
+        });
+        if (csv && csv[csv.length - 1] === ',') {
+            // Remove the last character (',')
+            csv = csv.slice(0, -1);
+        }
+        return csv;
+    }
+    #downloadCSV(data) {
+        const blob = new Blob([data.csv], { type: 'text/csv;charset=utf-8;' });
+        const url = URL.createObjectURL(blob);
+        const downloadButton = this.#renderer.createElement('a');
+        downloadButton.setAttribute('download', data.fileName);
+        downloadButton.href = url;
+        this.#renderer.appendChild(this.document.body, downloadButton);
+        downloadButton.click();
+        this.#renderer.removeChild(this.document.body, downloadButton);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyExportToCSVService, deps: [{ token: DOCUMENT }, { token: RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyExportToCSVService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyExportToCSVService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: Document, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }, { type: i0.RendererFactory2, decorators: [{
+                    type: Inject,
+                    args: [RendererFactory2]
+                }] }] });
+
+class BizyRouterService {
+    router;
+    static backPath = '';
+    transitionsEnd$;
+    transitionsStart$;
+    popStateEvent$;
+    routeChange$;
+    constructor(router) {
+        this.router = router;
+        this.transitionsEnd$ = this.router.events.pipe(filter$1(event => event instanceof NavigationEnd), map((event) => event.id), distinctUntilChanged(), map(() => this.router.routerState.snapshot.root));
+        this.transitionsStart$ = this.router.events.pipe(filter$1(event => event instanceof NavigationStart), map((event) => event.id), distinctUntilChanged(), map(() => this.router.routerState.snapshot.root));
+        this.popStateEvent$ = fromEvent(window, 'popstate');
+        this.routeChange$ = merge(this.transitionsEnd$, this.popStateEvent$).pipe(map(() => void 0));
+    }
+    getURL() {
+        return window.location.pathname;
+    }
+    getBackPath() {
+        return BizyRouterService.backPath;
+    }
+    getId(activatedRoute, param) {
+        return activatedRoute.snapshot.paramMap.get(param);
+    }
+    getQueryParam(activatedRoute, param) {
+        return activatedRoute.snapshot.queryParamMap.get(param);
+    }
+    getAllQueryParam() {
+        const params = new URL(window.location.href).searchParams;
+        const queryParams = {};
+        for (const [key, value] of params.entries()) {
+            queryParams[key] = value;
+        }
+        return queryParams;
+    }
+    goTo(data) {
+        if (data.replace) {
+            BizyRouterService.backPath = '';
+        }
+        else {
+            BizyRouterService.backPath = this.getURL();
+        }
+        if (data.path[0] === '/') {
+            this.router.navigateByUrl(`${data.path}${this._serialize(data.params)}`, { replaceUrl: data.replace ?? false, skipLocationChange: data.skip ?? false });
+            return;
+        }
+        const path = this.getURL();
+        const index = path.indexOf('?');
+        const url = index !== -1 ? path.substring(0, index) : path;
+        this.router.navigateByUrl(`${url}/${data.path}${this._serialize(data.params)}`, { replaceUrl: data.replace ?? false, skipLocationChange: data.skip ?? false });
+    }
+    goBack(data) {
+        if (BizyRouterService.backPath) {
+            history.back();
+            BizyRouterService.backPath = '';
+        }
+        else if (data && data.path) {
+            this.router.navigateByUrl(data.path, { replaceUrl: true });
+        }
+        else {
+            const index = this.getURL().lastIndexOf('/');
+            const backURL = this.getURL().substring(0, index);
+            this.router.navigateByUrl(backURL, { replaceUrl: true });
+        }
+    }
+    reload(force) {
+        if (force) {
+            window.location.reload();
+        }
+        else {
+            setTimeout(() => {
+                this.router.navigateByUrl('/', { skipLocationChange: true }).then(() => {
+                    this.goTo({ path: this.getURL(), params: this.getAllQueryParam() });
+                });
+            }, 1);
+        }
+    }
+    _serialize(params) {
+        if (!params) {
+            return '';
+        }
+        const str = [];
+        for (const param in params) {
+            if (params[param]) {
+                str.push(encodeURIComponent(param) + '=' + encodeURIComponent(params[param]));
+            }
+        }
+        const queryParams = str.length > 0 ? `?${str.join('&')}` : '';
+        return queryParams;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRouterService, deps: [{ token: Router }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRouterService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyRouterService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1$1.Router, decorators: [{
+                    type: Inject,
+                    args: [Router]
+                }] }] });
+
+class BizyCacheService {
+    router;
+    CACHE_PREFIX = 'BIZY-CACHE';
+    constructor(router) {
+        this.router = router;
+    }
+    getData(key) {
+        if (!key) {
+            key = this.router.getURL();
+        }
+        const data = sessionStorage.getItem(`${this.CACHE_PREFIX}-${key}`);
+        if (data) {
+            const _data = JSON.parse(data);
+            return Date.now() < _data.expiresAt ? _data.value : {};
+        }
+        return {};
+    }
+    setData(value, key, expiresAt) {
+        if (typeof value === 'undefined' || value === null) {
+            return;
+        }
+        if (!key) {
+            key = this.router.getURL();
+        }
+        if (!expiresAt) {
+            const date = new Date();
+            date.setHours(23, 59, 59);
+            expiresAt = date.getTime();
+        }
+        const data = {
+            expiresAt,
+            value
+        };
+        sessionStorage.setItem(`${this.CACHE_PREFIX}-${key}`, JSON.stringify(data));
+    }
+    remove(key) {
+        if (!key) {
+            key = this.router.getURL();
         }
-        this.#resizeObserver = new ResizeObserver(() => this.notifier$.next());
-        const resizeRef = this.resizeRef ? this.resizeRef : this.renderer.parentNode(this.elementRef.nativeElement) ? this.renderer.parentNode(this.elementRef.nativeElement) : this.elementRef.nativeElement;
-        this.#resizeObserver.observe(resizeRef);
-        this.#subscription.add(this.notifier$.pipe(debounceTime$1(50)).subscribe(() => {
-            this.#updateView();
-        }));
+        sessionStorage.removeItem(`${this.CACHE_PREFIX}-${key}`);
+    }
+    removeAll() {
+        const cacheKeys = Object.keys(sessionStorage).filter(key => {
+            return key.includes(this.CACHE_PREFIX);
+        });
+        cacheKeys.forEach(value => {
+            sessionStorage.removeItem(value);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCacheService, deps: [{ token: BizyRouterService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCacheService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCacheService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: BizyRouterService, decorators: [{
+                    type: Inject,
+                    args: [BizyRouterService]
+                }] }] });
+
+class BizyValidatorService {
+    isEmail = (value) => validator.isEmail(value, { allow_utf8_local_part: false });
+    dateIsAfter = (data) => {
+        if (!data || !data.date || !data.comparisonDate) {
+            return false;
+        }
+        const date = new Date(data.date);
+        const comparisonDate = new Date(data.comparisonDate);
+        return validator.isAfter(date.toString(), comparisonDate.toString());
     };
-    #updateView = () => {
-        this.itemTemplate = this.gridDirective.templateRef;
-        const rowWidth = this.elementRef.nativeElement.offsetWidth || this.elementRef.nativeElement.firstChild.offsetWidth;
-        let columnWidth = 100;
-        const fontSize = Number(getComputedStyle(this.elementRef.nativeElement).getPropertyValue('font-size').split('px')[0]);
-        const rowHeightParameter = getComputedStyle(this.elementRef.nativeElement).getPropertyValue('--bizy-grid-row-height');
-        if (rowHeightParameter && rowHeightParameter.includes('rem')) {
-            this.rowHeight = fontSize * Number(rowHeightParameter.split('rem')[0]);
+    dateIsBefore = (data) => {
+        if (!data || !data.date || !data.comparisonDate) {
+            return false;
         }
-        else if (rowHeightParameter && rowHeightParameter.includes('px')) {
-            this.rowHeight = Number(rowHeightParameter.split('px')[0]);
+        const date = new Date(data.date);
+        const comparisonDate = new Date(data.comparisonDate);
+        return validator.isBefore(date.toString(), comparisonDate.toString());
+    };
+    isAlpha = (value) => validator.isAlpha(value);
+    isAlphanumeric = (value) => validator.isAlphanumeric(value);
+    isNumeric = (value) => validator.isNumeric(value);
+    isNumber(number) {
+        const regex = /^-?\d+(\.\d+)?$/;
+        return regex.test(String(number).toLowerCase());
+    }
+    isString(string) {
+        return typeof string === 'string' || string instanceof String;
+    }
+    isInteger = (value) => validator.isInt(value);
+    isBoolean = (value) => validator.isBoolean(value);
+    isCreditCard = (value) => validator.isCreditCard(value);
+    isDataURI = (value) => validator.isDataURI(value);
+    isURL = (value) => validator.isURL(value);
+    isDate = (value) => validator.isDate(value);
+    isJSON = (value) => validator.isJSON(value);
+    isIP = (value, version) => validator.isIP(value, { version });
+    isJWT = (value) => validator.isJWT(value);
+    isLowercase = (value) => validator.isLowercase(value);
+    isUppercase = (value) => validator.isUppercase(value);
+    isMobilePhone = (data) => validator.isMobilePhone(data.value, data.locale);
+    isCUIT(cuit) {
+        const regex = /(^[0-9]{2}-[0-9]{8}-[0-9]$)/i;
+        const isCUIT = regex.test(String(cuit).toLowerCase());
+        if (!isCUIT) {
+            return false;
         }
-        let gap = 10;
-        const gapParameter = getComputedStyle(this.elementRef.nativeElement).getPropertyValue('--bizy-grid-gap');
-        if (gapParameter && gapParameter.includes('rem')) {
-            gap = fontSize * Number(gapParameter.split('rem')[0]);
+        cuit = String(cuit).replace(/[-_]/g, '');
+        if (cuit.length == 11) {
+            const mult = [5, 4, 3, 2, 7, 6, 5, 4, 3, 2];
+            let total = 0;
+            for (let i = 0; i < mult.length; i++) {
+                total += parseInt(cuit[i]) * mult[i];
+            }
+            const mod = total % 11;
+            const digit = mod === 0 ? 0 : mod === 1 ? 9 : 11 - mod;
+            return digit === parseInt(cuit[10]);
         }
-        else if (gapParameter && gapParameter.includes('px')) {
-            gap = Number(gapParameter.split('px')[0]);
+        return false;
+    }
+    isDNI(dni) {
+        const regex = /(^[1-9]{1}[0-9]{7}$)/i;
+        return regex.test(String(dni).toLowerCase());
+    }
+    isCBU(cbu) {
+        const _isLengthOk = (cbu) => {
+            return cbu.length === 22;
+        };
+        const _isValidAccount = (account) => {
+            if (account.length !== 14) {
+                return false;
+            }
+            const sum = Number(account[0]) * 3 +
+                Number(account[1]) * 9 +
+                Number(account[2]) * 7 +
+                Number(account[3]) * 1 +
+                Number(account[4]) * 3 +
+                Number(account[5]) * 9 +
+                Number(account[6]) * 7 +
+                Number(account[7]) * 1 +
+                Number(account[8]) * 3 +
+                Number(account[9]) * 9 +
+                Number(account[10]) * 7 +
+                Number(account[11]) * 1 +
+                Number(account[12]) * 3;
+            const diff = (10 - (sum % 10)) % 10; // The result of this should be only 1 digit
+            const checksum = Number(account[13]);
+            return diff === checksum;
+        };
+        const _isValidBankCode = (code) => {
+            if (code.length !== 8) {
+                return false;
+            }
+            const bank = code.substring(0, 3);
+            const checksumOne = code[3];
+            const branch = code.substring(4, 4 + 3);
+            const checksumTwo = code[7];
+            const sum = (Number(bank[0]) * 7) +
+                (Number(bank[1]) * 1) +
+                (Number(bank[2]) * 3) +
+                (Number(checksumOne) * 9) +
+                (Number(branch[0]) * 7) +
+                (Number(branch[1]) * 1) +
+                (Number(branch[2]) * 3);
+            const diff = (10 - (sum % 10)) % 10; // The result of this should be only 1 digit
+            return diff === Number(checksumTwo);
+        };
+        const bankCode = cbu.substring(0, 8);
+        const accountCode = cbu.substring(8, 8 + 14);
+        return (_isLengthOk(cbu) &&
+            _isValidBankCode(bankCode) &&
+            _isValidAccount(accountCode));
+    }
+    emailValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isEmail(control.value))
+                ? null
+                : { bizyEmail: true };
+        };
+    }
+    mobilePhoneValidator(locale) {
+        return (control) => {
+            return !control.value || !locale ||
+                (control.value && locale && this.isMobilePhone({ value: control.value, locale }))
+                ? null
+                : { bizyMobilePhone: true };
+        };
+    }
+    numberValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isNumber(control.value))
+                ? null
+                : { bizyNumber: true };
+        };
+    }
+    numericValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isNumeric(control.value))
+                ? null
+                : { bizyNumeric: true };
+        };
+    }
+    dateIsAfterValidator(comparisonDate) {
+        return (control) => {
+            return !control.value || !comparisonDate || (control.value && comparisonDate && !this.dateIsAfter({ date: control.value, comparisonDate }))
+                ? null
+                : { bizyDateIsAfter: true };
+        };
+    }
+    dateIsBeforeValidator(comparisonDate) {
+        return (control) => {
+            return !control.value || !comparisonDate || (control.value && comparisonDate && !this.dateIsBefore({ date: control.value, comparisonDate }))
+                ? null
+                : { bizyDateIsBefore: true };
+        };
+    }
+    alphaValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isAlpha(control.value))
+                ? null
+                : { bizyAlpha: true };
+        };
+    }
+    alphanumericValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isAlphanumeric(control.value))
+                ? null
+                : { bizyAlphanumeric: true };
+        };
+    }
+    integerValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isInteger(control.value))
+                ? null
+                : { bizyInteger: true };
+        };
+    }
+    dataURIValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isDataURI(control.value))
+                ? null
+                : { bizyDataURI: true };
+        };
+    }
+    urlValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isURL(control.value))
+                ? null
+                : { bizyURL: true };
+        };
+    }
+    jsonValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isJSON(control.value))
+                ? null
+                : { bizyJSON: true };
+        };
+    }
+    jwtValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isJWT(control.value))
+                ? null
+                : { bizyJWT: true };
+        };
+    }
+    lowerCaseValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isLowercase(control.value))
+                ? null
+                : { bizyLowerCase: true };
+        };
+    }
+    upperCaseValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isUppercase(control.value))
+                ? null
+                : { bizyUpperCase: true };
+        };
+    }
+    cuitValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isCUIT(control.value))
+                ? null
+                : { bizyCUIT: true };
+        };
+    }
+    dniValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isDNI(control.value))
+                ? null
+                : { bizyDNI: true };
+        };
+    }
+    cbuValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isCBU(control.value))
+                ? null
+                : { bizyCBU: true };
+        };
+    }
+    creditCardValidator() {
+        return (control) => {
+            return !control.value || (control.value && this.isCreditCard(control.value))
+                ? null
+                : { bizyCreditCard: true };
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyValidatorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyValidatorService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyValidatorService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class BizyStorageService {
+    get(key) {
+        const item = localStorage.getItem(key);
+        try {
+            return JSON.parse(item);
         }
-        const columnWidthParameter = getComputedStyle(this.elementRef.nativeElement).getPropertyValue('--bizy-grid-column-width');
-        if (columnWidthParameter && columnWidthParameter.includes('rem')) {
-            columnWidth = fontSize * Number(columnWidthParameter.split('rem')[0]);
+        catch (e) {
+            return item;
         }
-        else if (columnWidthParameter && columnWidthParameter.includes('px')) {
-            columnWidth = Number(columnWidthParameter.split('px')[0]);
+    }
+    set(key, value) {
+        if (typeof value === 'object') {
+            localStorage.setItem(key, JSON.stringify(value));
         }
-        columnWidth += gap;
-        const count = Math.trunc(rowWidth / (columnWidth));
-        if (Math.round((gap * (count - 1)) + (columnWidth * count)) <= (rowWidth)) {
-            this.itemsPerRow = count <= 0 ? 1 : count;
+        else if (typeof value === 'string') {
+            localStorage.setItem(key, value);
         }
         else {
-            this.itemsPerRow = (count - 1) <= 0 ? 1 : count - 1;
-        }
-        const itemRows = [];
-        for (let i = 0; i < this.items.length; i += this.itemsPerRow) {
-            const row = this.items.slice(i, i + this.itemsPerRow);
-            itemRows.push(row);
+            localStorage.setItem(key, String(value));
         }
-        this.itemRows = itemRows;
-        this.ref.detectChanges();
-    };
-    trackById(index, item) {
-        return item?.id ?? index;
     }
-    ngOnDestroy() {
-        this.#subscription.unsubscribe();
-        if (this.#rowScrollingMutationObserver) {
-            this.#rowScrollingMutationObserver.disconnect();
-        }
-        if (this.#resizeObserver) {
-            this.#resizeObserver.disconnect();
-        }
+    remove(key) {
+        localStorage.removeItem(key);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridComponent, deps: [{ token: ChangeDetectorRef }, { token: DOCUMENT }, { token: Renderer2 }, { token: ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyGridComponent, isStandalone: true, selector: "bizy-grid", inputs: { resizeRef: "resizeRef" }, queries: [{ propertyName: "gridDirective", first: true, predicate: BizyGridForDirective, descendants: true }], viewQueries: [{ propertyName: "content", first: true, predicate: ["gridScrollingContent"], descendants: true }], ngImport: i0, template: "<div class=\"bizy-grid\" [ngClass]=\"{'bizy-grid--empty': items && items.length === 0}\">\n\n    <cdk-virtual-scroll-viewport\n        class=\"bizy-grid__rows\"\n        [itemSize]=\"rowHeight\"\n        [minBufferPx]=\"rowHeight + (rowHeight * 5)\"\n        [maxBufferPx]=\"rowHeight + (rowHeight * 10)\">\n\n        <ng-content></ng-content>\n        \n        <ng-template #gridScrollingContent>\n            <ng-template let-item cdkVirtualFor [cdkVirtualForOf]=\"itemRows\">\n                <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n                    <ng-container *ngFor=\"let it of item; trackBy: trackById\">\n                        <ng-template *ngTemplateOutlet=\"itemTemplate; context: { $implicit: it }\"></ng-template>\n                    </ng-container>\n                </bizy-grid-row>\n            </ng-template>\n        </ng-template>\n    </cdk-virtual-scroll-viewport>\n\n</div>\n", styles: [":host{display:inline-block!important;min-height:var(--bizy-grid-min-height);max-height:var(--bizy-grid-max-height);height:var(--bizy-grid-height);width:var(--bizy-grid-width);flex:1;overflow-x:auto;overflow-y:hidden;font-size:1rem}:host:has(.bizy-grid--empty){height:0!important;min-height:0!important;max-height:0!important}.bizy-grid{width:inherit;height:inherit;min-width:fit-content;display:flex;flex-direction:column;row-gap:.3rem;overflow-x:clip;background-color:var(--bizy-grid-background-color)}.bizy-grid__rows{width:100%;display:flex;flex-direction:column;min-width:fit-content;overflow-x:hidden}::ng-deep .cdk-virtual-scrollable{height:100%;width:100%;overflow-y:auto!important;overflow-x:hidden!important;contain:inline-size!important}::ng-deep .cdk-virtual-scroll-content-wrapper{min-width:100%;max-width:100%}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar{width:.5rem;height:.5rem}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-grid-scroll-bar-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-grid-scroll-bar-hover-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-button{height:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2$2.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2$2.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2$2.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: BizyGridRowComponent, selector: "bizy-grid-row", inputs: ["rowHeight", "itemsPerRow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-grid', imports: [CommonModule, ScrollingModule, BizyGridRowComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bizy-grid\" [ngClass]=\"{'bizy-grid--empty': items && items.length === 0}\">\n\n    <cdk-virtual-scroll-viewport\n        class=\"bizy-grid__rows\"\n        [itemSize]=\"rowHeight\"\n        [minBufferPx]=\"rowHeight + (rowHeight * 5)\"\n        [maxBufferPx]=\"rowHeight + (rowHeight * 10)\">\n\n        <ng-content></ng-content>\n        \n        <ng-template #gridScrollingContent>\n            <ng-template let-item cdkVirtualFor [cdkVirtualForOf]=\"itemRows\">\n                <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n                    <ng-container *ngFor=\"let it of item; trackBy: trackById\">\n                        <ng-template *ngTemplateOutlet=\"itemTemplate; context: { $implicit: it }\"></ng-template>\n                    </ng-container>\n                </bizy-grid-row>\n            </ng-template>\n        </ng-template>\n    </cdk-virtual-scroll-viewport>\n\n</div>\n", styles: [":host{display:inline-block!important;min-height:var(--bizy-grid-min-height);max-height:var(--bizy-grid-max-height);height:var(--bizy-grid-height);width:var(--bizy-grid-width);flex:1;overflow-x:auto;overflow-y:hidden;font-size:1rem}:host:has(.bizy-grid--empty){height:0!important;min-height:0!important;max-height:0!important}.bizy-grid{width:inherit;height:inherit;min-width:fit-content;display:flex;flex-direction:column;row-gap:.3rem;overflow-x:clip;background-color:var(--bizy-grid-background-color)}.bizy-grid__rows{width:100%;display:flex;flex-direction:column;min-width:fit-content;overflow-x:hidden}::ng-deep .cdk-virtual-scrollable{height:100%;width:100%;overflow-y:auto!important;overflow-x:hidden!important;contain:inline-size!important}::ng-deep .cdk-virtual-scroll-content-wrapper{min-width:100%;max-width:100%}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar{width:.5rem;height:.5rem}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-grid-scroll-bar-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-grid-scroll-bar-hover-color)}::ng-deep .cdk-virtual-scrollable::-webkit-scrollbar-button{height:1rem}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef, decorators: [{
-                    type: Inject,
-                    args: [ChangeDetectorRef]
-                }] }, { type: Document, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }, { type: i0.Renderer2, decorators: [{
-                    type: Inject,
-                    args: [Renderer2]
-                }] }, { type: i0.ElementRef, decorators: [{
-                    type: Inject,
-                    args: [ElementRef]
-                }] }], propDecorators: { content: [{
-                type: ViewChild,
-                args: ['gridScrollingContent']
-            }], gridDirective: [{
-                type: ContentChild,
-                args: [BizyGridForDirective]
-            }], resizeRef: [{
-                type: Input
-            }] } });
-
-const COMPONENTS$g = [
-    BizyGridComponent,
-    BizyGridRowComponent
-];
-const DIRECTIVES$2 = [
-    BizyGridForDirective,
-];
-class BizyGridModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, imports: [BizyGridComponent,
-            BizyGridRowComponent, BizyGridForDirective], exports: [BizyGridComponent,
-            BizyGridRowComponent, BizyGridForDirective] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, imports: [BizyGridComponent,
-            BizyGridRowComponent] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyGridModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: COMPONENTS$g.concat(DIRECTIVES$2),
-                    exports: COMPONENTS$g.concat(DIRECTIVES$2),
-                }]
-        }] });
-
-const COMPONENTS$f = [
-    BizyInputComponent,
-    BizyInputOptionComponent
-];
-class BizyInputModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, imports: [BizyInputComponent,
-            BizyInputOptionComponent], exports: [BizyInputComponent,
-            BizyInputOptionComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, imports: [COMPONENTS$f] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyInputModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: COMPONENTS$f,
-                    exports: COMPONENTS$f,
-                }]
-        }] });
-
-class BizyListComponent {
-    id = `bizy-list-${Math.random()}`;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyListComponent, isStandalone: true, selector: "bizy-list", inputs: { id: "id" }, host: { properties: { "id": "id" } }, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;height:var(--bizy-list-height);overflow:auto;width:var(--bizy-list-width);display:flex;flex-direction:var(--bizy-list-flex-direction);column-gap:var(--bizy-list-column-gap);row-gap:var(--bizy-list-row-gap);justify-content:var(--bizy-list-justify-content);align-items:var(--bizy-list-align-items)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-list', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        '[id]': 'id'
-                    }, template: "<ng-content></ng-content>", styles: [":host{font-size:1rem;height:var(--bizy-list-height);overflow:auto;width:var(--bizy-list-width);display:flex;flex-direction:var(--bizy-list-flex-direction);column-gap:var(--bizy-list-column-gap);row-gap:var(--bizy-list-row-gap);justify-content:var(--bizy-list-justify-content);align-items:var(--bizy-list-align-items)}\n"] }]
-        }], propDecorators: { id: [{
-                type: Input
-            }] } });
-
-const COMPONENTS$e = [
-    BizyListComponent,
-];
-class BizyListModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, imports: [BizyListComponent], exports: [BizyListComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, imports: [COMPONENTS$e] });
+    clear() {
+        localStorage.clear();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyStorageService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyListModule, decorators: [{
-            type: NgModule,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyStorageService, decorators: [{
+            type: Injectable,
             args: [{
-                    imports: COMPONENTS$e,
-                    exports: COMPONENTS$e,
+                    providedIn: 'root'
                 }]
         }] });
 
-class BizyMenuOptionComponent {
-    id = `bizy-menu-option-${Math.random()}`;
-    disabled = false;
-    customClass = '';
-    selected = false;
-    onSelect = new EventEmitter();
-    _onSelect(event) {
-        if (this.disabled) {
-            return;
+var COLOR;
+(function (COLOR) {
+    COLOR["DEFAULT"] = "#666666";
+    COLOR["INFO"] = "#2484C6";
+    COLOR["SUCCESS"] = "#65BF6C";
+    COLOR["WARNING"] = "#F7A64C";
+    COLOR["ERROR"] = "#EF4C59";
+})(COLOR || (COLOR = {}));
+class BizyLogService {
+    #lastLogTimestamp = 0;
+    #log(log, color, param) {
+        const difference = this.#lastLogTimestamp ? Date.now() - this.#lastLogTimestamp : 0;
+        this.#lastLogTimestamp = Date.now();
+        const timestampStyles = 'color: #EE5DFF';
+        const logStyles = `color: ${color}; font-size: 12px;`;
+        const date = new Date();
+        if (param) {
+            console.log(`%c${date.toLocaleString()}: %c${log} %c(+${difference}ms)`, timestampStyles, logStyles, timestampStyles, param);
+        }
+        else {
+            console.log(`%c${date.toLocaleString()}: %c${log} %c(+${difference}ms)`, timestampStyles, logStyles, timestampStyles);
         }
-        this.onSelect.emit(event);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyMenuOptionComponent, isStandalone: true, selector: "bizy-menu-option", inputs: { id: "id", disabled: "disabled", customClass: "customClass", selected: "selected" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    [ngClass]=\"{'bizy-menu-option--selected': selected, 'bizy-menu-option--disabled': disabled}\"\n    class=\"bizy-menu-option {{customClass}}\">\n\n    <span class=\"bizy-menu-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>\n\n<span class=\"bizy-menu-option__menu\">\n    <ng-content select=\"bizy-menu\"></ng-content>\n</span>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu-option__menu:not(:empty)) .bizy-menu-option{display:none!important}.bizy-menu-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-menu-option-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-menu-option-color);cursor:pointer}.bizy-menu-option:hover{background-color:var(--bizy-menu-option-hover-background-color)}.bizy-menu-option--selected{color:var(--bizy-menu-option-selected-color)!important;background-color:var(--bizy-menu-option-selected-background-color)!important}::ng-deep .bizy-menu-option--selected *{color:var(--bizy-menu-option-selected-color)!important}.bizy-menu-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-menu-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;width:100%}::ng-deep .bizy-menu-option__menu *{color:var(--bizy-menu-option-color);fill:var(--bizy-menu-option-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuOptionComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-menu-option', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n    type=\"button\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    [ngClass]=\"{'bizy-menu-option--selected': selected, 'bizy-menu-option--disabled': disabled}\"\n    class=\"bizy-menu-option {{customClass}}\">\n\n    <span class=\"bizy-menu-option__content\">\n        <ng-content></ng-content>\n    </span>\n    \n</button>\n\n<span class=\"bizy-menu-option__menu\">\n    <ng-content select=\"bizy-menu\"></ng-content>\n</span>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu-option__menu:not(:empty)) .bizy-menu-option{display:none!important}.bizy-menu-option{font-size:1rem;width:100%;border:none;background-color:var(--bizy-menu-option-background-color);display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:.5rem;color:var(--bizy-menu-option-color);cursor:pointer}.bizy-menu-option:hover{background-color:var(--bizy-menu-option-hover-background-color)}.bizy-menu-option--selected{color:var(--bizy-menu-option-selected-color)!important;background-color:var(--bizy-menu-option-selected-background-color)!important}::ng-deep .bizy-menu-option--selected *{color:var(--bizy-menu-option-selected-color)!important}.bizy-menu-option--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-menu-option__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;width:100%}::ng-deep .bizy-menu-option__menu *{color:var(--bizy-menu-option-color);fill:var(--bizy-menu-option-color)}\n"] }]
-        }], propDecorators: { id: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], customClass: [{
-                type: Input
-            }], selected: [{
-                type: Input
-            }], onSelect: [{
-                type: Output
-            }] } });
-
-class BizyMenuComponent {
-    #ref = inject(ChangeDetectorRef);
-    options;
-    id = `bizy-menu-${Math.random()}`;
-    disabled = false;
-    offsetX = 0;
-    offsetY = 0;
-    customClass = '';
-    hideArrow = false;
-    opened = false;
-    onSelect = new EventEmitter();
-    _menuWidth;
-    #subscription = new Subscription();
-    bizyMenuOptionsId = 'bizyMenuOptionsId';
-    _onSelect(event) {
-        if (this.disabled) {
-            return;
+    debug(data, param) {
+        if (typeof data === 'string') {
+            this.#log(data, COLOR.DEFAULT, param);
         }
-        this.onSelect.emit(event);
-        if (this.options && this.options.length > 0) {
-            this.selectButton(event);
+        else {
+            this.#template({ ...data, param: data.param, title: 'Debug', color: COLOR.DEFAULT });
+        }
+    }
+    info(data, param) {
+        if (typeof data === 'string') {
+            this.#log(data, COLOR.INFO, param);
+        }
+        else {
+            this.#template({ ...data, param: data.param, title: 'Info', color: COLOR.INFO });
+        }
+    }
+    success(data, param) {
+        if (typeof data === 'string') {
+            this.#log(data, COLOR.SUCCESS, param);
         }
-    }
-    selectButton(event) {
-        this.opened = !this.opened;
-        if (event && event.srcElement && event.srcElement.offsetWidth) {
-            this._menuWidth = event.srcElement.offsetWidth;
+        else {
+            this.#template({ ...data, param: data.param, title: 'Success', color: COLOR.SUCCESS });
         }
-        if (this.opened) {
-            this.#subscription = new Subscription();
-            this.#subscription.add(fromEvent(window, 'scroll', { capture: true }).subscribe(() => {
-                if (event && event.target && event.target.id && (event.target.id === this.id || event.target.id === this.bizyMenuOptionsId)) {
-                    return;
-                }
-                this.opened = false;
-                this.#ref.detectChanges();
-                this.#subscription.unsubscribe();
-            }));
-            if (this.options) {
-                this.options.forEach((option) => {
-                    this.#subscription.add(option.onSelect.subscribe(event => {
-                        this.close(event);
-                    }));
-                });
-            }
+    }
+    warning(data, param) {
+        if (typeof data === 'string') {
+            this.#log(data, COLOR.WARNING, param);
         }
         else {
-            this.#subscription.unsubscribe();
+            this.#template({ ...data, param: data.param, title: 'Warning', color: COLOR.WARNING });
         }
     }
-    close = (event) => {
-        if (event && event.target && event.target.id && event.target.id === this.id) {
-            return;
+    error(data, param) {
+        if (typeof data === 'string') {
+            this.#log(data, COLOR.ERROR, param);
+        }
+        else {
+            this.#template({ ...data, param: data.param, title: 'Error', color: COLOR.ERROR });
         }
-        this.opened = false;
-        this.#subscription.unsubscribe();
-        this.#ref.detectChanges();
-    };
-    ngOnDestroy() {
-        this.#subscription.unsubscribe();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyMenuComponent, isStandalone: true, selector: "bizy-menu", inputs: { id: "id", disabled: "disabled", offsetX: "offsetX", offsetY: "offsetY", customClass: "customClass", hideArrow: "hideArrow", opened: "opened" }, outputs: { onSelect: "onSelect" }, queries: [{ propertyName: "options", predicate: BizyMenuOptionComponent }], ngImport: i0, template: "<button \n    type=\"button\"\n    class=\"bizy-menu {{customClass}}\"\n    [ngClass]=\"{'bizy-menu--disabled': disabled}\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    cdkOverlayOrigin \n    #bizyMenuTrigger=\"cdkOverlayOrigin\">\n\n    <span class=\"bizy-menu__content\">\n        <ng-content></ng-content>\n    </span>\n    \n    <svg \n        class=\"bizy-menu__arrow\"\n        *ngIf=\"!hideArrow\" \n        viewBox=\"0 0 96 96\" \n        [ngClass]=\"{'bizy-menu__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M81.8457,25.3876a6.0239,6.0239,0,0,0-8.45.7676L48,56.6257l-25.396-30.47a5.999,5.999,0,1,0-9.2114,7.6879L43.3943,69.8452a5.9969,5.9969,0,0,0,9.2114,0L82.6074,33.8431A6.0076,6.0076,0,0,0,81.8457,25.3876Z\"/>\n    </svg>\n</button>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOffsetX]=\"offsetX\"\n    [cdkConnectedOverlayOffsetY]=\"offsetY\"\n    [cdkConnectedOverlayMinWidth]=\"_menuWidth\"\n    [cdkConnectedOverlayOrigin]=\"bizyMenuTrigger\"\n    (overlayOutsideClick)=\"close($event)\"\n    [cdkConnectedOverlayPush]=\"true\"\n    [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n    [cdkConnectedOverlayViewportMargin]=\"8\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-menu__options\" [id]=\"bizyMenuOptionsId\">\n\n        <span class=\"bizy-menu__options__header\">\n            <ng-content select=\"bizy-menu-title\"></ng-content>\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-content select=\"bizy-menu-option\"></ng-content>\n\n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu__options:empty) .bizy-menu>.bizy-menu__arrow{display:none!important}.bizy-menu{font-size:1rem;width:100%;border:none;background-color:transparent;display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:var(--bizy-menu-padding);color:var(--bizy-menu-color);cursor:pointer}.bizy-menu--disabled{pointer-events:none;opacity:.5;cursor:not-allowed!important}.bizy-menu__arrow{height:var(--bizy-menu-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-menu-color)}.bizy-menu__arrow--opened{transform:rotate(180deg)}.bizy-menu__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;pointer-events:none}.bizy-menu__options{background-color:var(--bizy-menu-background-color);min-width:var(--bizy-menu-min-width);max-width:var(--bizy-menu-max-width);max-height:var(--bizy-menu-max-height);overflow-y:auto;overflow-x:hidden;width:100%;display:flex;flex-direction:column;position:relative;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014}.bizy-menu__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-menu__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-menu-scroll-bar-color)}.bizy-menu__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-menu-scroll-bar-hover-color)}.bizy-menu__options::-webkit-scrollbar-button{height:1rem}.bizy-menu__options__header{position:sticky;z-index:1;top:0;display:flex;flex-direction:column;row-gap:.3rem;background-color:#fff}::ng-deep .bizy-menu__options__header{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2$2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-menu', imports: [CommonModule, FormsModule, OverlayModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n    type=\"button\"\n    class=\"bizy-menu {{customClass}}\"\n    [ngClass]=\"{'bizy-menu--disabled': disabled}\"\n    [id]=\"id\"\n    (click)=\"_onSelect($event)\"\n    (keyup.enter)=\"_onSelect($event)\"\n    cdkOverlayOrigin \n    #bizyMenuTrigger=\"cdkOverlayOrigin\">\n\n    <span class=\"bizy-menu__content\">\n        <ng-content></ng-content>\n    </span>\n    \n    <svg \n        class=\"bizy-menu__arrow\"\n        *ngIf=\"!hideArrow\" \n        viewBox=\"0 0 96 96\" \n        [ngClass]=\"{'bizy-menu__arrow--opened': opened}\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M81.8457,25.3876a6.0239,6.0239,0,0,0-8.45.7676L48,56.6257l-25.396-30.47a5.999,5.999,0,1,0-9.2114,7.6879L43.3943,69.8452a5.9969,5.9969,0,0,0,9.2114,0L82.6074,33.8431A6.0076,6.0076,0,0,0,81.8457,25.3876Z\"/>\n    </svg>\n</button>\n\n<ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOffsetX]=\"offsetX\"\n    [cdkConnectedOverlayOffsetY]=\"offsetY\"\n    [cdkConnectedOverlayMinWidth]=\"_menuWidth\"\n    [cdkConnectedOverlayOrigin]=\"bizyMenuTrigger\"\n    (overlayOutsideClick)=\"close($event)\"\n    [cdkConnectedOverlayPush]=\"true\"\n    [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n    [cdkConnectedOverlayViewportMargin]=\"8\"\n    [cdkConnectedOverlayOpen]=\"opened\">\n\n    <span class=\"bizy-menu__options\" [id]=\"bizyMenuOptionsId\">\n\n        <span class=\"bizy-menu__options__header\">\n            <ng-content select=\"bizy-menu-title\"></ng-content>\n            <ng-content select=\"bizy-input\"></ng-content>\n        </span>\n\n        <ng-content select=\"bizy-menu-option\"></ng-content>\n\n    </span>\n\n</ng-template>\n", styles: [":host{font-size:1rem}:host:has(>.bizy-menu__options:empty) .bizy-menu>.bizy-menu__arrow{display:none!important}.bizy-menu{font-size:1rem;width:100%;border:none;background-color:transparent;display:flex;align-items:center;justify-content:space-between;column-gap:.5rem;padding:var(--bizy-menu-padding);color:var(--bizy-menu-color);cursor:pointer}.bizy-menu--disabled{pointer-events:none;opacity:.5;cursor:not-allowed!important}.bizy-menu__arrow{height:var(--bizy-menu-arrow-height);pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-menu-color)}.bizy-menu__arrow--opened{transform:rotate(180deg)}.bizy-menu__content{font-size:1rem;display:flex;align-items:center;column-gap:.3rem;pointer-events:none}.bizy-menu__options{background-color:var(--bizy-menu-background-color);min-width:var(--bizy-menu-min-width);max-width:var(--bizy-menu-max-width);max-height:var(--bizy-menu-max-height);overflow-y:auto;overflow-x:hidden;width:100%;display:flex;flex-direction:column;position:relative;box-shadow:0 7px 14px #32325d1a,0 3px 6px #00000014}.bizy-menu__options::-webkit-scrollbar{width:.5rem;height:.5rem}.bizy-menu__options::-webkit-scrollbar-thumb{border-radius:1rem;background-color:var(--bizy-menu-scroll-bar-color)}.bizy-menu__options::-webkit-scrollbar-thumb:hover{background-color:var(--bizy-menu-scroll-bar-hover-color)}.bizy-menu__options::-webkit-scrollbar-button{height:1rem}.bizy-menu__options__header{position:sticky;z-index:1;top:0;display:flex;flex-direction:column;row-gap:.3rem;background-color:#fff}::ng-deep .bizy-menu__options__header{--bizy-input-width: auto;--bizy-input-background-color: #fff;--bizy-input-min-width: var(--bizy-select-min-width);--bizy-input-max-width: auto}\n"] }]
-        }], propDecorators: { options: [{
-                type: ContentChildren,
-                args: [BizyMenuOptionComponent]
-            }], id: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], offsetX: [{
-                type: Input
-            }], offsetY: [{
-                type: Input
-            }], customClass: [{
-                type: Input
-            }], hideArrow: [{
-                type: Input
-            }], opened: [{
-                type: Input
-            }], onSelect: [{
-                type: Output
-            }] } });
-
-class BizyMenuTitleComponent {
-    customClass = '';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyMenuTitleComponent, isStandalone: true, selector: "bizy-menu-title", inputs: { customClass: "customClass" }, ngImport: i0, template: "<span class=\"bizy-menu-title {{customClass}}\">\n    <ng-content></ng-content>\n</span>\n", styles: [":host{font-size:1rem}.bizy-menu-title{background-color:var(--bizy-menu-title-background-color);color:var(--bizy-menu-title-color);padding:.5rem;cursor:default;text-decoration:underline .1rem var(--bizy-menu-title-underline-color);text-underline-offset:.3rem;display:flex;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuTitleComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-menu-title', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"bizy-menu-title {{customClass}}\">\n    <ng-content></ng-content>\n</span>\n", styles: [":host{font-size:1rem}.bizy-menu-title{background-color:var(--bizy-menu-title-background-color);color:var(--bizy-menu-title-color);padding:.5rem;cursor:default;text-decoration:underline .1rem var(--bizy-menu-title-underline-color);text-underline-offset:.3rem;display:flex;align-items:center}\n"] }]
-        }], propDecorators: { customClass: [{
-                type: Input
-            }] } });
-
-const COMPONENTS$d = [
-    BizyMenuComponent,
-    BizyMenuOptionComponent,
-    BizyMenuTitleComponent
-];
-class BizyMenuModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, imports: [BizyMenuComponent,
-            BizyMenuOptionComponent,
-            BizyMenuTitleComponent], exports: [BizyMenuComponent,
-            BizyMenuOptionComponent,
-            BizyMenuTitleComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, imports: [BizyMenuComponent,
-            BizyMenuOptionComponent] });
+    /** DEPRECATED */
+    templateDebug(data) {
+        this.#template({ ...data, title: 'Debug', color: COLOR.DEFAULT });
+    }
+    /** DEPRECATED */
+    templateSucc(data) {
+        this.#template({ ...data, title: 'Success', color: COLOR.SUCCESS });
+    }
+    /** DEPRECATED */
+    templateInfo(data) {
+        this.#template({ ...data, title: 'Info', color: COLOR.INFO });
+    }
+    /** DEPRECATED */
+    templateWarn(data) {
+        this.#template({ ...data, title: 'Warning', color: COLOR.WARNING });
+    }
+    /** DEPRECATED */
+    templateError(data) {
+        this.#template({ ...data, title: 'Error', color: COLOR.ERROR });
+    }
+    #template(data) {
+        const log = `(${data.title}) ${data.fileName} - ${data.functionName}`;
+        this.#log(log, data.color, data.param);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyLogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyLogService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyMenuModule, decorators: [{
-            type: NgModule,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyLogService, decorators: [{
+            type: Injectable,
             args: [{
-                    imports: COMPONENTS$d,
-                    exports: COMPONENTS$d,
+                    providedIn: 'root'
                 }]
         }] });
 
-const EMPTY_CHART = [0];
-const MIN_CHART_SIZE = 350; // px;
-class BizyPieChartComponent {
-    elementRef;
-    document;
-    ref;
-    renderer;
-    resizeRef = null;
-    tooltip = true;
-    type = 'pie';
-    download = { hide: false, label: 'Descargar', name: 'Bizy' };
-    onLabelFormatter;
-    onTooltipFormatter;
-    onSelect = new EventEmitter();
-    onDownload = new EventEmitter();
-    #echarts = null;
-    #mutationObserver = null;
-    #resizeObserver = null;
-    #subscription = new Subscription();
-    #chartContainer = null;
-    #afterViewInit = new BehaviorSubject(false);
-    #resize$ = new Subject();
-    #data = EMPTY_CHART;
-    constructor(elementRef, document, ref, renderer) {
-        this.elementRef = elementRef;
-        this.document = document;
-        this.ref = ref;
-        this.renderer = renderer;
-    }
-    ngAfterViewInit() {
-        this.#mutationObserver = new MutationObserver(() => {
-            if (this.elementRef && this.elementRef.nativeElement && (this.elementRef.nativeElement.offsetWidth || this.elementRef.nativeElement.offsetHeight)) {
-                this.#afterViewInit.next(true);
-                this.#mutationObserver.disconnect();
+class BizyCopyToClipboardService {
+    #clipboard = inject(Clipboard);
+    copy(data) {
+        return new Promise((resolve, reject) => {
+            try {
+                if (!data) {
+                    resolve();
+                    return;
+                }
+                setTimeout(() => {
+                    let toCopy = '';
+                    if (typeof data === 'string' || data instanceof String) {
+                        toCopy = data;
+                    }
+                    else if (data.items && data.items.length > 0 && data.model) {
+                        for (const key in data.model) {
+                            if (key) {
+                                toCopy += `${data.model[key]},`;
+                            }
+                        }
+                        data.items.forEach(_item => {
+                            // Remove the last character (',')
+                            toCopy = toCopy.slice(0, -2);
+                            toCopy += '\n';
+                            for (const key in data.model) {
+                                let value = _item;
+                                const nestedProperty = key.split('.');
+                                nestedProperty.forEach(_property => {
+                                    value = value[_property];
+                                });
+                                if (typeof value !== undefined && value !== null) {
+                                    toCopy += `${String(value).replace(/\n/g, '')},`;
+                                }
+                                else {
+                                    toCopy += ',';
+                                }
+                            }
+                        });
+                    }
+                    const pending = this.#clipboard.beginCopy(toCopy);
+                    let remainingAttempts = 3;
+                    const attempt = () => {
+                        const result = pending.copy();
+                        if (!result && --remainingAttempts) {
+                            setTimeout(attempt);
+                        }
+                        else {
+                            // Remember to destroy when you're done!
+                            pending.destroy();
+                            resolve();
+                        }
+                    };
+                    attempt();
+                }, 100);
+            }
+            catch (error) {
+                reject(error);
             }
         });
-        this.#mutationObserver.observe(this.document.body, { childList: true, subtree: true });
     }
-    set data(data) {
-        if (!data) {
-            return;
-        }
-        if (data.length > 0) {
-            this.#setChartData(data);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCopyToClipboardService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCopyToClipboardService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyCopyToClipboardService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+var BIZY_FORMAT_SECONDS_LANGUAGE;
+(function (BIZY_FORMAT_SECONDS_LANGUAGE) {
+    BIZY_FORMAT_SECONDS_LANGUAGE["SPANISH"] = "es";
+    BIZY_FORMAT_SECONDS_LANGUAGE["ENGLISH"] = "en";
+})(BIZY_FORMAT_SECONDS_LANGUAGE || (BIZY_FORMAT_SECONDS_LANGUAGE = {}));
+var BIZY_FORMAT_SECONDS_FORMAT;
+(function (BIZY_FORMAT_SECONDS_FORMAT) {
+    BIZY_FORMAT_SECONDS_FORMAT["DATE_TIME"] = "date-time";
+    BIZY_FORMAT_SECONDS_FORMAT["TIME"] = "time";
+})(BIZY_FORMAT_SECONDS_FORMAT || (BIZY_FORMAT_SECONDS_FORMAT = {}));
+class BizyFormatSecondsService {
+    #options = {
+        language: BIZY_FORMAT_SECONDS_LANGUAGE.SPANISH,
+        format: BIZY_FORMAT_SECONDS_FORMAT.TIME
+    };
+    getOptions() {
+        return this.#options;
+    }
+    setOptions(options) {
+        if (options && options.language) {
+            this.#options.language = options.language;
         }
-        else {
-            this.#deleteChartContainer();
-            this.#setChartData(EMPTY_CHART);
+        if (options && options.format) {
+            this.#options.format = options.format;
         }
     }
-    async #setChartData(data) {
-        this.#subscription.add(this.#afterViewInit.pipe(filter(value => value === true), take(1)).subscribe(() => {
-            this.#createChartContainer();
-            if (!this.#chartContainer) {
-                return;
-            }
-            if (data && data.length > 0 && data[0] !== 0) {
-                this.#data = [];
-                data.forEach(_d => {
-                    if (!_d.value) {
-                        _d.value = 0;
-                    }
-                    if (!_d.name) {
-                        _d.name = '---';
-                    }
-                    const itemStyle = _d.color ? { color: _d.color } : {};
-                    this.#data.push({
-                        name: _d.name,
-                        value: _d.value,
-                        itemStyle
-                    });
-                });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormatSecondsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormatSecondsService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyFormatSecondsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+/**
+ * Copyright 2020 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the 'License');
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an 'AS IS' BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+// This function's role is to enable smooth transition to the brave new world of
+// User-Agent Client Hints. If you have legacy code that relies on
+// `navigator.userAgent` and which relies on entropy that will go away by
+// default, you *need* to refactor it to use UA-CH. This function is to be used
+// as a stop gap, to enable smooth transition during that period.
+/**
+* @param {string[]} hints
+* @return {Promise<string|undefined>} A Promise that resolves to a string if a
+*   UA could be synthesized from client hints, otherwise undefined.
+*/
+async function getUserAgentUsingClientHints(hints) {
+    // Helper functions for platform specific strings
+    const GetCrosSpecificString = (values) => {
+        let osCPUFragment = '';
+        if (values.bitness == '64') {
+            if (values.architecture == 'x86') {
+                osCPUFragment = 'x86_64';
             }
-            else {
-                this.#data = EMPTY_CHART;
+            else if (values.architecture == 'arm') {
+                osCPUFragment = 'aarch64';
             }
-            const itemStyle = this.type === 'pie' ? {
-                emphasis: {
-                    label: {
-                        show: true
-                    }
-                },
-                normal: {
-                    label: {
-                        position: 'outer',
-                        formatter: this.onLabelFormatter
-                    },
-                    labelLine: {
-                        show: true
-                    }
-                }
-            } :
-                {
-                    borderRadius: 10,
-                    borderColor: '#fff',
-                    borderWidth: 2
-                };
-            const label = this.type === 'pie' ? undefined : { show: false, position: 'center' };
-            const series = [{
-                    type: 'pie',
-                    radius: this.type === 'pie' ? '50%' : ['40%', '55%'],
-                    center: ['50%', '50%'],
-                    data: this.#data,
-                    itemStyle,
-                    label
-                }];
-            const textColor = getComputedStyle(this.document.documentElement).getPropertyValue('--bizy-tooltip-color') ?? '#000';
-            const textBackgroundColor = getComputedStyle(this.document.documentElement).getPropertyValue('--bizy-tooltip-background-color') ?? '#fff';
-            const borderColor = getComputedStyle(this.document.documentElement).getPropertyValue('--bizy-tooltip-border-color') ?? '#fff';
-            const toolbox = {
-                show: true,
-                feature: {
-                    mySaveAsImage: {
-                        show: !this.download.hide,
-                        icon: 'path://M288 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 242.7-73.4-73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l128 128c12.5 12.5 32.8 12.5 45.3 0l128-128c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L288 274.7 288 32zM64 352c-35.3 0-64 28.7-64 64l0 32c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-32c0-35.3-28.7-64-64-64l-101.5 0-45.3 45.3c-25 25-65.5 25-90.5 0L165.5 352 64 352zm368 56a24 24 0 1 1 0 48 24 24 0 1 1 0-48z',
-                        title: this.download.label,
-                        onclick: () => {
-                            setTimeout(() => {
-                                html2canvas(this.#chartContainer).then(canvas => {
-                                    var link = document.createElement('a');
-                                    link.href = canvas.toDataURL('image/png');
-                                    link.download = `${this.download.name}.png`;
-                                    this.renderer.appendChild(this.document.body, link);
-                                    link.click();
-                                    this.renderer.removeChild(this.document.body, link);
-                                    this.onDownload.emit();
-                                });
-                            }, 500);
-                        }
-                    }
-                },
-                emphasis: {
-                    iconStyle: {
-                        color: textColor,
-                        borderColor,
-                        borderWidth: 1,
-                        textBackgroundColor,
-                        textPadding: 5,
-                    }
-                }
-            };
-            const tooltip = {
-                show: this.tooltip,
-                trigger: 'item',
-                appendToBody: true,
-                formatter: this.onTooltipFormatter
-            };
-            const legend = this.type === 'pie' ? { show: false } : { show: true, orient: 'vertical', left: 'left' };
-            const option = {
-                tooltip,
-                toolbox,
-                legend,
-                series
-            };
-            this.#echarts = echarts.init(this.#chartContainer);
-            this.#echarts.setOption(option);
-            this.#echarts.on('click', params => {
-                this.onSelect.emit(params.name);
-            });
-            this.#resizeObserver = new ResizeObserver(() => this.#resize$.next());
-            const resizeRef = this.resizeRef ? this.resizeRef : this.renderer.parentNode(this.elementRef.nativeElement) ? this.renderer.parentNode(this.elementRef.nativeElement) : this.elementRef.nativeElement;
-            this.#resizeObserver.observe(resizeRef);
-            this.#subscription.add(this.#resize$.pipe(skip(1), auditTime(300), throttleTime(500)).subscribe(() => {
-                this.#deleteChartContainer();
-                this.#createChartContainer();
-                if (!this.#chartContainer) {
-                    return;
-                }
-                this.#echarts = echarts.init(this.#chartContainer);
-                this.#echarts.setOption({ ...option, series: option.series.map(_serie => { return { ..._serie, data: this.#data }; }) });
-                this.#echarts.on('click', params => {
-                    this.onSelect.emit(params.name);
-                });
-            }));
-        }));
-    }
-    #createChartContainer = () => {
-        if (this.#chartContainer || !this.elementRef || !this.elementRef.nativeElement) {
-            return;
         }
-        let elementWidth = this.elementRef.nativeElement.offsetWidth || MIN_CHART_SIZE;
-        let elementHeight = this.elementRef.nativeElement.offsetHeight || MIN_CHART_SIZE;
-        let minWidth = MIN_CHART_SIZE;
-        let minHeight = MIN_CHART_SIZE;
-        const chartMinWidth = getComputedStyle(this.document.body).getPropertyValue('--bizy-chart-min-width');
-        const pieChartMinHeight = getComputedStyle(this.document.body).getPropertyValue('--bizy-chart-min-height');
-        if (Number(chartMinWidth)) {
-            minWidth = Number(chartMinWidth);
+        else if (values.architecture == 'arm' && values.bitness == '32') {
+            osCPUFragment = 'armv7l';
         }
-        if (Number(pieChartMinHeight)) {
-            minHeight = Number(pieChartMinHeight);
+        if (osCPUFragment == '') {
+            return `X11; CrOS ${values.platformVersion}`;
         }
-        const width = Math.max(elementWidth, minWidth);
-        const height = Math.max(elementHeight, minHeight);
-        this.#chartContainer = this.renderer.createElement('div');
-        this.renderer.setStyle(this.#chartContainer, 'width', `${width}px`);
-        this.renderer.setStyle(this.#chartContainer, 'height', `${height}px`);
-        this.renderer.appendChild(this.elementRef.nativeElement, this.#chartContainer);
-        this.ref.detectChanges();
+        return `X11; CrOS ${osCPUFragment} ${values.platformVersion}`;
     };
-    #deleteChartContainer = () => {
-        if (!this.#chartContainer || !this.elementRef || !this.elementRef.nativeElement) {
-            return;
+    const GetWindowsSpecificString = (values) => {
+        let osCPUFragment = '';
+        if (values.architecture == 'x86' && values.bitness == '64') {
+            osCPUFragment = '; Win64; x64';
+        }
+        else if (values.architecture == 'arm') {
+            osCPUFragment = '; ARM';
+        }
+        else if (values.wow64 === true) {
+            osCPUFragment = '; WOW64';
+        }
+        return `Windows NT ${getWindowsPlatformVersion(values.platformVersion)}${osCPUFragment}`;
+    };
+    const GetMacSpecificString = (values) => {
+        let newUA = 'Macintosh;';
+        newUA += values.architecture === 'arm' ? ' ARM ' : ' Intel ';
+        newUA += 'Mac OS X ';
+        let macVersion = values.platformVersion;
+        if (macVersion.indexOf('.') > -1) {
+            macVersion = macVersion.split('.').join('_');
+        }
+        newUA += macVersion;
+        return newUA;
+    };
+    const GetAndroidSpecificString = (values) => {
+        let newUA = 'Linux; Android ';
+        newUA += values.platformVersion;
+        if (values.model) {
+            newUA += '; ';
+            newUA += values.model;
+        }
+        return newUA;
+    };
+    const Initialize = (values) => {
+        if (!values.architecture) {
+            values.architecture = 'x86';
+        }
+        if (!values.bitness) {
+            values.bitness = '64';
+        }
+        if (!values.model) {
+            values.model = '';
+        }
+        if (!values.platform) {
+            values.platform = 'Windows';
+        }
+        if (!values.platformVersion) {
+            values.platformVersion = '10.0';
+        }
+        if (!values.wow64) {
+            values.wow64 = false;
         }
-        this.#echarts.clear();
-        this.renderer.removeChild(this.elementRef.nativeElement, this.#chartContainer);
-        this.#chartContainer = null;
-        this.ref.detectChanges();
+        return values;
     };
-    ngOnDestroy() {
-        this.#subscription.unsubscribe();
-        if (this.#mutationObserver) {
-            this.#mutationObserver.disconnect();
+    // @ts-ignore-error
+    if (!navigator.userAgentData) {
+        return Promise.resolve('');
+    }
+    // Verify that this is a Chromium-based browser
+    let isChromium = false;
+    let chromiumVersion;
+    // eslint-disable-next-line prefer-regex-literals
+    const isChromeUAPattern = new RegExp('AppleWebKit/537.36 \\(KHTML, like Gecko\\) Chrome/\\d+.\\d+.\\d+.\\d+ (Mobile )?Safari/537.36$');
+    // @ts-ignore-error
+    navigator.userAgentData.brands.forEach(value => {
+        if (value.brand == 'Chromium') {
+            // Let's double check the UA string as well, so we don't accidentally
+            // capture a headless browser or friendly bot (which should report as
+            // HeadlessChrome or something entirely different).
+            isChromium = isChromeUAPattern.test(navigator.userAgent);
+            chromiumVersion = value.version;
         }
-        if (this.#resizeObserver) {
-            this.#resizeObserver.disconnect();
+    });
+    // @ts-ignore
+    if (!isChromium || chromiumVersion < 100) {
+        // If this is not a Chromium-based browser, the UA string should be very
+        // different. Or, if this is a Chromium lower than 100, it doesn't have
+        // all the hints we rely on. So let's bail.
+        return Promise.resolve('');
+    }
+    // Main logic
+    return new Promise(resolve => {
+        // @ts-ignore-error
+        navigator.userAgentData.getHighEntropyValues(hints).then(values => {
+            let initialValues = {
+                // @ts-ignore-error
+                platform: navigator.userAgentData?.platform,
+                version: chromiumVersion
+            };
+            values = Object.assign(initialValues, values);
+            values = Initialize(values);
+            let newUA = 'Mozilla/5.0 (';
+            if (['Chrome OS', 'Chromium OS'].includes(values.platform)) {
+                newUA += GetCrosSpecificString(values);
+            }
+            else if (values.platform == 'Windows') {
+                newUA += GetWindowsSpecificString(values);
+            }
+            else if (values.platform == 'macOS') {
+                newUA += GetMacSpecificString(values);
+            }
+            else if (values.platform == 'Android') {
+                newUA += GetAndroidSpecificString(values);
+            }
+            else {
+                newUA += 'X11; Linux x86_64';
+            }
+            newUA += ') AppleWebKit/537.36 (KHTML, like Gecko) Chrome/';
+            newUA += getVersion(values?.fullVersionList, initialValues.version);
+            // @ts-ignore-error
+            if (navigator.userAgentData.mobile) {
+                newUA += ' Mobile';
+            }
+            newUA += ' Safari/537.36';
+            resolve(newUA);
+        });
+    });
+}
+function getVersion(fullVersionList, majorVersion) {
+    // If we don't get a fullVersionList, or it's somehow undefined, return
+    // the reduced version number.
+    return (fullVersionList?.find((item) => item.brand == 'Google Chrome')?.version ||
+        `${majorVersion}.0.0.0`);
+}
+function getWindowsPlatformVersion(platformVersion) {
+    // https://wicg.github.io/ua-client-hints/#get-the-legacy-windows-version-number
+    const versionMap = new Map([
+        ['0.3.0', '6.3'], // Windows 8.1
+        ['0.2.0', '6.2'], // Windows 8
+        ['0.1.0', '6.1'] // Windows 7
+    ]);
+    if (versionMap.has(platformVersion)) {
+        return versionMap.get(platformVersion);
+    }
+    // Windows 10 and above send "Windows NT 10.0"
+    return '10.0';
+}
+/**
+   * @param {string[]} hints
+   * @return {Promise<string|undefined>} A Promise that resolves on overriding the
+   *   navigator.userAgent string.
+   */
+async function overrideUserAgentUsingClientHints(hints) {
+    return new Promise(resolve => {
+        getUserAgentUsingClientHints(hints).then(newUA => {
+            if (newUA) {
+                // Got a new UA value. Now override `navigator.userAgent`.
+                Object.defineProperty(navigator, 'userAgent', {
+                    value: newUA,
+                    writable: false,
+                    configurable: true
+                });
+            }
+            else {
+                newUA = navigator.userAgent;
+            }
+            resolve(newUA);
+        });
+    });
+}
+const exportedForTests = { getVersion, getWindowsPlatformVersion };
+
+class BizyDeviceService {
+    #device = inject(DeviceDetectorService);
+    async getUserAgent() {
+        try {
+            const userAgent = await overrideUserAgentUsingClientHints([
+                'architecture',
+                'bitness',
+                'model',
+                'platformVersion',
+                'uaFullVersion',
+                'fullVersionList'
+            ]);
+            return userAgent;
         }
-        if (this.#echarts) {
-            this.#echarts.clear();
+        catch {
+            return window.navigator.userAgent;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartComponent, deps: [{ token: ElementRef }, { token: DOCUMENT }, { token: ChangeDetectorRef }, { token: Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyPieChartComponent, isStandalone: true, selector: "bizy-pie-chart", inputs: { resizeRef: "resizeRef", tooltip: "tooltip", type: "type", download: "download", onLabelFormatter: "onLabelFormatter", onTooltipFormatter: "onTooltipFormatter", data: "data" }, outputs: { onSelect: "onSelect", onDownload: "onDownload" }, ngImport: i0, template: '', isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    isMobile = () => this.#device.isMobile();
+    isTablet = () => this.#device.isTablet();
+    isDesktop = () => this.#device.isDesktop();
+    isPortrait = () => this.#device.orientation === 'portrait';
+    isLandscape = () => this.#device.orientation === 'landscape';
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyDeviceService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyDeviceService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'bizy-pie-chart',
-                    template: '',
-                    imports: [CommonModule],
-                    changeDetection: ChangeDetectionStrategy.OnPush
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef, decorators: [{
-                    type: Inject,
-                    args: [ElementRef]
-                }] }, { type: Document, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }, { type: i0.ChangeDetectorRef, decorators: [{
-                    type: Inject,
-                    args: [ChangeDetectorRef]
-                }] }, { type: i0.Renderer2, decorators: [{
-                    type: Inject,
-                    args: [Renderer2]
-                }] }], propDecorators: { resizeRef: [{
-                type: Input
-            }], tooltip: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], download: [{
-                type: Input
-            }], onLabelFormatter: [{
-                type: Input
-            }], onTooltipFormatter: [{
-                type: Input
-            }], onSelect: [{
-                type: Output
-            }], onDownload: [{
-                type: Output
-            }], data: [{
-                type: Input
-            }] } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyDeviceService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
 
-const COMPONENTS$c = [
-    BizyPieChartComponent,
+const SERVICES = [
+    BizyAnimationService,
+    BizyDeviceService,
+    BizyCacheService,
+    BizyCopyToClipboardService,
+    BizyExportToCSVService,
+    BizyFormatSecondsService,
+    BizyKeyboardService,
+    BizyLogService,
+    BizyRouterService,
+    BizyStorageService,
+    BizyValidatorService,
+    BizyViewportService
 ];
-class BizyPieChartModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, imports: [BizyPieChartComponent], exports: [BizyPieChartComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, imports: [COMPONENTS$c] });
+class BizyServicesModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule, providers: SERVICES });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPieChartModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyServicesModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: COMPONENTS$c,
-                    exports: COMPONENTS$c,
+                    providers: SERVICES
                 }]
         }] });
 
-class BizyPopupWrapperComponent {
-    dynamicComponentContainer;
-    #data = inject(DIALOG_DATA);
-    #dialogRef = inject(DialogRef);
-    #popup = inject(BizyPopupService);
-    #ref = inject(ChangeDetectorRef);
-    disabled = false;
-    disableClose = false;
-    disableDrag = false;
-    ngAfterViewInit() {
-        this.loadDynamicComponent();
-        if (this.#data && this.#data.disableClose) {
-            this.disableClose = this.#data.disableClose;
-        }
-        if (this.#data && this.#data.disableDrag) {
-            this.disableDrag = this.#data.disableDrag;
-        }
-    }
-    loadDynamicComponent = () => {
-        if (this.#data && this.#data.component) {
-            this.dynamicComponentContainer.clear();
-            this.dynamicComponentContainer.createComponent(this.#data.component);
-            this.#ref.detectChanges();
-        }
-    };
-    async close() {
-        this.disabled = true;
-        this.#popup.close({ id: this.#dialogRef.id });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPopupWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyPopupWrapperComponent, isStandalone: true, selector: "bizy-popup-wrapper", viewQueries: [{ propertyName: "dynamicComponentContainer", first: true, predicate: ["dynamicComponentContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"bizy-popup-wrapper\" cdkDrag>\n\n    <button *ngIf=\"!disableDrag\" class=\"bizy-popup-wrapper__drag-button\" cdkDragHandle>\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" class=\"bizy-popup-wrapper__drag-button__icon\">\n            <path d=\"M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z\"/>\n        </svg>\n\n    </button>\n\n    <button *ngIf=\"!disableClose\" class=\"bizy-popup-wrapper__close-button\" (click)=\"close()\" (keyup.enter)=\"close()\">\n\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\" class=\"bizy-popup-wrapper__close-button__icon\">\n            <path d=\"M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z\"/>\n        </svg>\n\n    </button>\n\n    <ng-container #dynamicComponentContainer></ng-container>\n\n</div>", styles: [":host{font-size:1rem;position:fixed!important;inset:50%;transform:translate(-50%,-50%);min-height:150px;min-width:150px;width:fit-content;height:fit-content;z-index:10}.bizy-popup-wrapper{position:relative;padding:var(--bizy-popup-padding);background-color:var(--bizy-popup-background-color);min-width:var(--bizy-popup-min-width);width:var(--bizy-popup-width);max-width:var(--bizy-popup-max-width)}.bizy-popup-wrapper__drag-button{position:absolute;left:-.9rem;top:-.9rem;border:var(--bizy-popup-drag-button-border);border-radius:50%;padding:.2rem;place-items:center;display:grid;background-color:var(--bizy-popup-drag-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__drag-button:hover{transform:scale(1.1)}.bizy-popup-wrapper__drag-button__icon{height:1rem}.bizy-popup-wrapper__drag-button__icon{fill:var(--bizy-popup-drag-button-color)}.bizy-popup-wrapper__close-button{position:absolute;right:-.9rem;top:-.9rem;border:var(--bizy-popup-close-button-border);border-radius:50%;padding:.25rem .35rem;place-items:center;display:grid;background-color:var(--bizy-popup-close-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{transform:scale(1.1)}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-hover-color)}.bizy-popup-wrapper__close-button__icon{height:1rem;transition:fill .2s ease,}.bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyPopupWrapperComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bizy-popup-wrapper', imports: [CommonModule, DialogModule, DragDropModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bizy-popup-wrapper\" cdkDrag>\n\n    <button *ngIf=\"!disableDrag\" class=\"bizy-popup-wrapper__drag-button\" cdkDragHandle>\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" class=\"bizy-popup-wrapper__drag-button__icon\">\n            <path d=\"M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z\"/>\n        </svg>\n\n    </button>\n\n    <button *ngIf=\"!disableClose\" class=\"bizy-popup-wrapper__close-button\" (click)=\"close()\" (keyup.enter)=\"close()\">\n\n\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\" class=\"bizy-popup-wrapper__close-button__icon\">\n            <path d=\"M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z\"/>\n        </svg>\n\n    </button>\n\n    <ng-container #dynamicComponentContainer></ng-container>\n\n</div>", styles: [":host{font-size:1rem;position:fixed!important;inset:50%;transform:translate(-50%,-50%);min-height:150px;min-width:150px;width:fit-content;height:fit-content;z-index:10}.bizy-popup-wrapper{position:relative;padding:var(--bizy-popup-padding);background-color:var(--bizy-popup-background-color);min-width:var(--bizy-popup-min-width);width:var(--bizy-popup-width);max-width:var(--bizy-popup-max-width)}.bizy-popup-wrapper__drag-button{position:absolute;left:-.9rem;top:-.9rem;border:var(--bizy-popup-drag-button-border);border-radius:50%;padding:.2rem;place-items:center;display:grid;background-color:var(--bizy-popup-drag-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__drag-button:hover{transform:scale(1.1)}.bizy-popup-wrapper__drag-button__icon{height:1rem}.bizy-popup-wrapper__drag-button__icon{fill:var(--bizy-popup-drag-button-color)}.bizy-popup-wrapper__close-button{position:absolute;right:-.9rem;top:-.9rem;border:var(--bizy-popup-close-button-border);border-radius:50%;padding:.25rem .35rem;place-items:center;display:grid;background-color:var(--bizy-popup-close-button-background-color);cursor:pointer;transition:transform .2s;z-index:1}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{transform:scale(1.1)}.bizy-popup-wrapper__close-button:hover .bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-hover-color)}.bizy-popup-wrapper__close-button__icon{height:1rem;transition:fill .2s ease,}.bizy-popup-wrapper__close-button__icon{fill:var(--bizy-popup-close-button-color)}\n"] }]
-        }], propDecorators: { dynamicComponentContainer: [{
-                type: ViewChild,
-                args: ['dynamicComponentContainer', { read: ViewContainerRef }]
-            }] } });
-
 class BizyPopupService {
     #animation = inject(BizyAnimationService);
     #validator = inject(BizyValidatorService);