@bizy/core 21.8.0 → 21.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/bizy-core.mjs +83 -91
- package/fesm2022/bizy-core.mjs.map +1 -1
- package/package.json +1 -1
- package/types/bizy-core.d.ts +8 -8
package/fesm2022/bizy-core.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import * as i3 from '@angular/cdk/dialog';
|
|
|
7
7
|
import { DIALOG_DATA, DialogRef, DialogModule, Dialog } from '@angular/cdk/dialog';
|
|
8
8
|
import * as i1$1 from '@angular/cdk/drag-drop';
|
|
9
9
|
import { DragDropModule } from '@angular/cdk/drag-drop';
|
|
10
|
-
import { debounceTime as debounceTime$1, map, filter, distinctUntilChanged as distinctUntilChanged$1, take as take$1
|
|
10
|
+
import { debounceTime as debounceTime$1, map, filter, distinctUntilChanged as distinctUntilChanged$1, switchMap, tap, takeUntil, take as take$1 } from 'rxjs/operators';
|
|
11
11
|
import * as i1$2 from '@angular/router';
|
|
12
12
|
import { NavigationEnd, NavigationStart, Router } from '@angular/router';
|
|
13
13
|
import validator from 'validator';
|
|
@@ -11317,11 +11317,11 @@ class BizyCardComponent {
|
|
|
11317
11317
|
}
|
|
11318
11318
|
getNativeElement = () => this.#elementRef?.nativeElement;
|
|
11319
11319
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11320
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: BizyCardComponent, isStandalone: true, selector: "bizy-card", inputs: { id: "id", disabled: "disabled", selected: "selected", customClass: "customClass" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<button \n type=\"button\"\n (
|
|
11320
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: BizyCardComponent, isStandalone: true, selector: "bizy-card", inputs: { id: "id", disabled: "disabled", selected: "selected", customClass: "customClass" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<button \n type=\"button\"\n (click)=\"_onSelect($event)\"\n (keyup.enter)=\"_onSelect($event)\"\n class=\"bizy-card {{customClass}}\"\n [ngClass]=\"{'bizy-card--disabled': disabled}\">\n\n <span class=\"bizy-card__header\">\n\n <span class=\"bizy-card__header__start bizy-card__slot\">\n <ng-content select=\"[slot=header-start]\"></ng-content>\n </span>\n\n <span class=\"bizy-card__header__end bizy-card__slot\">\n <ng-content select=\"[slot=header-end]\"></ng-content>\n </span>\n\n </span>\n\n <span class=\"bizy-card__content\">\n\n <ng-content></ng-content>\n\n </span>\n\n <span class=\"bizy-card__footer\">\n\n <span class=\"bizy-card__footer__start bizy-card__slot\">\n <ng-content select=\"[slot=footer-start]\"></ng-content>\n </span>\n\n <span class=\"bizy-card__footer__end bizy-card__slot\">\n <ng-content select=\"[slot=footer-end]\"></ng-content>\n </span>\n\n </span>\n\n</button>", styles: [":host{font-size:1rem;height:var(--bizy-card-height);min-height:var(--bizy-card-min-height);max-height:var(--bizy-card-max-height);width:var(--bizy-card-width);min-width:var(--bizy-card-min-width);max-width:var(--bizy-card-max-width)}.bizy-card{height:100%;width:100%;cursor:var(--bizy-card-cursor);border-top:var(--bizy-card-border-top, var(--bizy-card-border, none));border-right:var(--bizy-card-border-right, var(--bizy-card-border, none));border-bottom:var(--bizy-card-border-bottom, var(--bizy-card-border, none));border-left:var(--bizy-card-border-left, var(--bizy-card-border, none));border-radius:var(--bizy-card-border-radius);overflow:hidden;padding:var(--bizy-card-padding);display:flex;flex-direction:column;justify-content:space-between;row-gap:var(--bizy-card-row-gap);background-color:var(--bizy-card-background-color);transition:transform .25s ease-in-out;box-shadow:var(--bizy-card-box-shadow)}.bizy-card:hover{transform:translateY(-1px);box-shadow:var(--bizy-card-hover-box-shadow)}.bizy-card:has(>.bizy-card__content:empty)>.bizy-card__content{display:none}.bizy-card:has(>.bizy-card__content:empty)>.bizy-card__header:not(:empty){height:100%!important}.bizy-card:has(>.bizy-card__content:empty)>.bizy-card__footer:not(:empty){height:100%!important}.bizy-card--disabled{pointer-events:none;opacity:.5;cursor:not-allowed!important}.bizy-card__content:not(:empty){display:flex;align-items:var(--bizy-card-content-align-items);column-gap:var(--bizy-card-content-column-gap);height:100%;width:100%;background-color:var(--bizy-card-content-background-color)}.bizy-card__header:has(>.bizy-card__header__start:empty):has(>.bizy-card__header__end:empty){display:none}.bizy-card__header:not(:empty){width:100%;height:fit-content;display:grid;grid-template-columns:auto auto;align-items:var(--bizy-card-header-align-items);column-gap:var(--bizy-card-header-column-gap);background-color:var(--bizy-card-header-background-color)}.bizy-card__header__start{justify-content:flex-start}.bizy-card__header__end{justify-content:flex-end}.bizy-card__slot{width:100%;display:flex;align-items:center;column-gap:var(--bizy-card-slot-column-gap);height:100%;overflow:hidden}.bizy-card__footer:has(>.bizy-card__footer__start:empty):has(>.bizy-card__footer__end:empty){display:none}.bizy-card__footer:not(:empty){width:100%;height:fit-content;display:grid;grid-template-columns:auto auto;align-items:var(--bizy-card-footer-align-items);column-gap:var(--bizy-card-footer-column-gap);background-color:var(--bizy-card-footer-background-color)}.bizy-card__footer__start{justify-content:flex-start}.bizy-card__footer__end{justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
11321
11321
|
}
|
|
11322
11322
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyCardComponent, decorators: [{
|
|
11323
11323
|
type: Component,
|
|
11324
|
-
args: [{ selector: 'bizy-card', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n type=\"button\"\n (
|
|
11324
|
+
args: [{ selector: 'bizy-card', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n type=\"button\"\n (click)=\"_onSelect($event)\"\n (keyup.enter)=\"_onSelect($event)\"\n class=\"bizy-card {{customClass}}\"\n [ngClass]=\"{'bizy-card--disabled': disabled}\">\n\n <span class=\"bizy-card__header\">\n\n <span class=\"bizy-card__header__start bizy-card__slot\">\n <ng-content select=\"[slot=header-start]\"></ng-content>\n </span>\n\n <span class=\"bizy-card__header__end bizy-card__slot\">\n <ng-content select=\"[slot=header-end]\"></ng-content>\n </span>\n\n </span>\n\n <span class=\"bizy-card__content\">\n\n <ng-content></ng-content>\n\n </span>\n\n <span class=\"bizy-card__footer\">\n\n <span class=\"bizy-card__footer__start bizy-card__slot\">\n <ng-content select=\"[slot=footer-start]\"></ng-content>\n </span>\n\n <span class=\"bizy-card__footer__end bizy-card__slot\">\n <ng-content select=\"[slot=footer-end]\"></ng-content>\n </span>\n\n </span>\n\n</button>", styles: [":host{font-size:1rem;height:var(--bizy-card-height);min-height:var(--bizy-card-min-height);max-height:var(--bizy-card-max-height);width:var(--bizy-card-width);min-width:var(--bizy-card-min-width);max-width:var(--bizy-card-max-width)}.bizy-card{height:100%;width:100%;cursor:var(--bizy-card-cursor);border-top:var(--bizy-card-border-top, var(--bizy-card-border, none));border-right:var(--bizy-card-border-right, var(--bizy-card-border, none));border-bottom:var(--bizy-card-border-bottom, var(--bizy-card-border, none));border-left:var(--bizy-card-border-left, var(--bizy-card-border, none));border-radius:var(--bizy-card-border-radius);overflow:hidden;padding:var(--bizy-card-padding);display:flex;flex-direction:column;justify-content:space-between;row-gap:var(--bizy-card-row-gap);background-color:var(--bizy-card-background-color);transition:transform .25s ease-in-out;box-shadow:var(--bizy-card-box-shadow)}.bizy-card:hover{transform:translateY(-1px);box-shadow:var(--bizy-card-hover-box-shadow)}.bizy-card:has(>.bizy-card__content:empty)>.bizy-card__content{display:none}.bizy-card:has(>.bizy-card__content:empty)>.bizy-card__header:not(:empty){height:100%!important}.bizy-card:has(>.bizy-card__content:empty)>.bizy-card__footer:not(:empty){height:100%!important}.bizy-card--disabled{pointer-events:none;opacity:.5;cursor:not-allowed!important}.bizy-card__content:not(:empty){display:flex;align-items:var(--bizy-card-content-align-items);column-gap:var(--bizy-card-content-column-gap);height:100%;width:100%;background-color:var(--bizy-card-content-background-color)}.bizy-card__header:has(>.bizy-card__header__start:empty):has(>.bizy-card__header__end:empty){display:none}.bizy-card__header:not(:empty){width:100%;height:fit-content;display:grid;grid-template-columns:auto auto;align-items:var(--bizy-card-header-align-items);column-gap:var(--bizy-card-header-column-gap);background-color:var(--bizy-card-header-background-color)}.bizy-card__header__start{justify-content:flex-start}.bizy-card__header__end{justify-content:flex-end}.bizy-card__slot{width:100%;display:flex;align-items:center;column-gap:var(--bizy-card-slot-column-gap);height:100%;overflow:hidden}.bizy-card__footer:has(>.bizy-card__footer__start:empty):has(>.bizy-card__footer__end:empty){display:none}.bizy-card__footer:not(:empty){width:100%;height:fit-content;display:grid;grid-template-columns:auto auto;align-items:var(--bizy-card-footer-align-items);column-gap:var(--bizy-card-footer-column-gap);background-color:var(--bizy-card-footer-background-color)}.bizy-card__footer__start{justify-content:flex-start}.bizy-card__footer__end{justify-content:flex-end}\n"] }]
|
|
11325
11325
|
}], propDecorators: { id: [{
|
|
11326
11326
|
type: Input
|
|
11327
11327
|
}], disabled: [{
|
|
@@ -11523,11 +11523,11 @@ class BizyInputComponent {
|
|
|
11523
11523
|
bizyInputWrapper;
|
|
11524
11524
|
id = `bizy-input-${Math.random()}`;
|
|
11525
11525
|
name = `bizy-input-${Math.random()}`;
|
|
11526
|
-
type = 'text';
|
|
11527
11526
|
customClass = '';
|
|
11528
11527
|
placeholder = '';
|
|
11529
11528
|
debounceTime = 250;
|
|
11530
11529
|
rows = 4;
|
|
11530
|
+
type = 'text';
|
|
11531
11531
|
maxLength = null;
|
|
11532
11532
|
autofocus = false;
|
|
11533
11533
|
disabled = false;
|
|
@@ -11540,15 +11540,26 @@ class BizyInputComponent {
|
|
|
11540
11540
|
onBlur = new EventEmitter();
|
|
11541
11541
|
onFocus = new EventEmitter();
|
|
11542
11542
|
onPaste = new EventEmitter();
|
|
11543
|
-
set bizyInput(
|
|
11544
|
-
if (
|
|
11545
|
-
this.#input =
|
|
11543
|
+
set bizyInput(inputElement) {
|
|
11544
|
+
if (inputElement) {
|
|
11545
|
+
this.#input = inputElement;
|
|
11546
|
+
this.#subscription.unsubscribe();
|
|
11547
|
+
this.#subscription = new Subscription();
|
|
11546
11548
|
setTimeout(() => {
|
|
11549
|
+
if (this.type === 'currency' && this.#input.nativeElement.setValue) {
|
|
11550
|
+
this.#input.nativeElement.setValue(this._currencyValue);
|
|
11551
|
+
}
|
|
11552
|
+
this.#subscription.add(this.onChange$.pipe(debounceTime(this.debounceTime)).subscribe(value => {
|
|
11553
|
+
this.valueChange.emit(value);
|
|
11554
|
+
this.onChange.emit(value);
|
|
11555
|
+
}));
|
|
11556
|
+
this.#subscription.add(fromEvent(this.#input.nativeElement, 'focus').subscribe(this.#focus));
|
|
11557
|
+
this.#subscription.add(fromEvent(this.#input.nativeElement, 'blur').subscribe(this.#blur));
|
|
11558
|
+
this.#subscription.add(fromEvent(this.#input.nativeElement, 'paste').subscribe(this.#paste));
|
|
11547
11559
|
this.setFocus(this.autofocus);
|
|
11548
11560
|
}, 0);
|
|
11549
11561
|
}
|
|
11550
11562
|
}
|
|
11551
|
-
;
|
|
11552
11563
|
set value(value) {
|
|
11553
11564
|
if (typeof value === 'undefined') {
|
|
11554
11565
|
return;
|
|
@@ -11575,9 +11586,9 @@ class BizyInputComponent {
|
|
|
11575
11586
|
#subscription = new Subscription();
|
|
11576
11587
|
#optionSubscription = new Subscription();
|
|
11577
11588
|
onChange$ = new Subject();
|
|
11578
|
-
|
|
11579
|
-
|
|
11580
|
-
|
|
11589
|
+
getWidth = () => {
|
|
11590
|
+
return this.bizyInputWrapper && this.bizyInputWrapper.nativeElement && this.bizyInputWrapper.nativeElement.offsetWidth ? this.bizyInputWrapper.nativeElement.offsetWidth : 0;
|
|
11591
|
+
};
|
|
11581
11592
|
_onchange = (value) => {
|
|
11582
11593
|
if (this.disabled || this.readonly) {
|
|
11583
11594
|
return;
|
|
@@ -11604,23 +11615,10 @@ class BizyInputComponent {
|
|
|
11604
11615
|
this.onBackspace.emit(event);
|
|
11605
11616
|
}, this.debounceTime);
|
|
11606
11617
|
};
|
|
11607
|
-
setTouched(touched) {
|
|
11618
|
+
setTouched = (touched) => {
|
|
11608
11619
|
this.touched = touched;
|
|
11609
11620
|
this.#ref.detectChanges();
|
|
11610
|
-
}
|
|
11611
|
-
ngAfterViewInit() {
|
|
11612
|
-
if (this.type === 'currency' && this.#input.nativeElement.setValue) {
|
|
11613
|
-
this.#input.nativeElement.setValue(this._currencyValue);
|
|
11614
|
-
}
|
|
11615
|
-
this.#subscription.add(this.onChange$.pipe(debounceTime(this.debounceTime)).subscribe(value => {
|
|
11616
|
-
this.valueChange.emit(value);
|
|
11617
|
-
this.onChange.emit(value);
|
|
11618
|
-
}));
|
|
11619
|
-
this.#input.nativeElement.addEventListener('focus', this.#focus);
|
|
11620
|
-
this.#input.nativeElement.addEventListener('blur', this.#blur);
|
|
11621
|
-
this.#input.nativeElement.addEventListener('paste', this.#paste);
|
|
11622
|
-
this.#afterViewInit.next(true);
|
|
11623
|
-
}
|
|
11621
|
+
};
|
|
11624
11622
|
#focus = (event) => {
|
|
11625
11623
|
this.focused = true;
|
|
11626
11624
|
this.onFocus.emit(event);
|
|
@@ -11660,20 +11658,18 @@ class BizyInputComponent {
|
|
|
11660
11658
|
};
|
|
11661
11659
|
getNativeElement = () => this.#elementRef?.nativeElement;
|
|
11662
11660
|
setFocus = (focus) => {
|
|
11663
|
-
|
|
11664
|
-
|
|
11665
|
-
|
|
11666
|
-
|
|
11667
|
-
|
|
11668
|
-
|
|
11669
|
-
|
|
11670
|
-
|
|
11671
|
-
|
|
11672
|
-
|
|
11673
|
-
|
|
11674
|
-
|
|
11675
|
-
this.#ref.detectChanges();
|
|
11676
|
-
}));
|
|
11661
|
+
if (!this.#input || !this.#input.nativeElement) {
|
|
11662
|
+
return;
|
|
11663
|
+
}
|
|
11664
|
+
if (focus) {
|
|
11665
|
+
this.#input.nativeElement.focus();
|
|
11666
|
+
this.focused = true;
|
|
11667
|
+
}
|
|
11668
|
+
else {
|
|
11669
|
+
this.#input.nativeElement.blur();
|
|
11670
|
+
this.focused = false;
|
|
11671
|
+
}
|
|
11672
|
+
this.#ref.detectChanges();
|
|
11677
11673
|
};
|
|
11678
11674
|
close = (event, button) => {
|
|
11679
11675
|
if (button && event && event.target && event.target === button) {
|
|
@@ -11685,15 +11681,9 @@ class BizyInputComponent {
|
|
|
11685
11681
|
ngOnDestroy() {
|
|
11686
11682
|
this.#subscription.unsubscribe();
|
|
11687
11683
|
this.#optionSubscription.unsubscribe();
|
|
11688
|
-
this.#afterViewInitSubscription.unsubscribe();
|
|
11689
|
-
if (this.#input && this.#input.nativeElement) {
|
|
11690
|
-
this.#input.nativeElement.removeEventListener('focus', this.#focus);
|
|
11691
|
-
this.#input.nativeElement.removeEventListener('blur', this.#blur);
|
|
11692
|
-
this.#input.nativeElement.removeEventListener('paste', this.#paste);
|
|
11693
|
-
}
|
|
11694
11684
|
}
|
|
11695
11685
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11696
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: BizyInputComponent, isStandalone: true, selector: "bizy-input", inputs: { id: "id", name: "name",
|
|
11686
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: BizyInputComponent, isStandalone: true, selector: "bizy-input", inputs: { id: "id", name: "name", customClass: "customClass", placeholder: "placeholder", debounceTime: "debounceTime", rows: "rows", type: "type", maxLength: "maxLength", autofocus: "autofocus", disabled: "disabled", readonly: "readonly", value: "value" }, outputs: { valueChange: "valueChange", onChange: "onChange", onEnter: "onEnter", onBackspace: "onBackspace", onSelect: "onSelect", onBlur: "onBlur", onFocus: "onFocus", onPaste: "onPaste" }, queries: [{ propertyName: "options", predicate: BizyInputOptionComponent }], viewQueries: [{ propertyName: "bizyInputWrapper", first: true, predicate: ["bizyInputWrapper"], descendants: true }, { propertyName: "bizyInput", first: true, predicate: ["bizyInput"], descendants: true }], ngImport: i0, template: "<button\n #bizyInputWrapper\n type=\"button\"\n (click)=\"_onClick($event)\"\n (keyup)=\"_onClick($event)\"\n class=\"bizy-input {{customClass}}\"\n (focus)=\"setFocus(true)\"\n cdkOverlayOrigin\n #bizyInputTrigger=\"cdkOverlayOrigin\"\n [ngClass]=\"{'bizy-input--disabled': disabled, 'bizy-input--negative': type === 'currency' && _currencyValue < 0}\">\n\n <span class=\"bizy-input__header\">\n <ng-content select=\"[slot=header]\"></ng-content>\n </span>\n\n <span class=\"bizy-input__content\" [ngClass]=\"{'bizy-input__content--readonly': readonly}\">\n\n <span class=\"bizy-input__content__prefix\">\n <ng-content select=\"[slot=prefix]\"></ng-content>\n </span>\n\n @if (type !== 'textarea') {\n <input\n #bizyInput\n [id]=\"id\"\n class=\"bizy-input__content__input\"\n [type]=\"type === 'currency' ? 'tel' : type\"\n [placeholder]=\"placeholder\"\n [readonly]=\"readonly\"\n [maxlength]=\"maxLength\"\n [bizyCurrencyFormat]=\"type === 'currency'\"\n [bizyCurrencyOptions]=\"currencyOptions\"\n [bizyOnlyPhoneDigits]=\"type === 'tel'\"\n (keyup.enter)=\"_onEnter($event)\"\n (keyup.backspace)=\"_onBackspace($event)\"\n [ngModel]=\"_value\"\n (ngModelChange)=\"_onchange($event)\"/>\n }\n\n @if (type === 'textarea') {\n <textarea\n #bizyInput\n [id]=\"id\"\n [rows]=\"rows\"\n [placeholder]=\"placeholder\"\n [readonly]=\"readonly\"\n [maxlength]=\"maxLength\"\n class=\"bizy-input__content__input\"\n (keyup.enter)=\"_onEnter($event)\"\n (keyup.backspace)=\"_onBackspace($event)\"\n [ngModel]=\"_value\"\n (ngModelChange)=\"_onchange($event)\">\n </textarea>\n }\n\n <span class=\"bizy-input__content__suffix\">\n <ng-content select=\"[slot=suffix]\"></ng-content>\n </span>\n\n </span>\n\n <span class=\"bizy-input__bottom-line\" [ngClass]=\"{'bizy-input__bottom-line--visible': focused}\"></span>\n\n</button>\n\n<ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayMinWidth]=\"bizyInputWrapper?.offsetWidth\"\n [cdkConnectedOverlayOrigin]=\"bizyInputTrigger\"\n (overlayOutsideClick)=\"close($event, bizyInputWrapper)\"\n [cdkConnectedOverlayOpen]=\"opened\">\n\n <span class=\"bizy-input__options\">\n\n <ng-content select=\"bizy-input-option\"></ng-content>\n\n </span>\n\n</ng-template>\n\n@if (touched) {\n <span class=\"bizy-input__errors\">\n <ng-content select=\"[slot=error]\"></ng-content>\n </span>\n}\n", styles: [":host{width:var(--bizy-input-width);min-width:var(--bizy-input-min-width);max-width:var(--bizy-input-max-width);display:flex;flex-direction:column;row-gap:.3rem}:host:has(>.bizy-input__errors:not(:empty)) .bizy-input__bottom-line{background-color:var(--bizy-input-invalid-color)!important;visibility:visible!important}:host:has(>.bizy-input__errors:not(:empty)) .bizy-input__content__input{color:var(--bizy-input-invalid-color)!important}.bizy-input{width:100%;background-color:var(--bizy-input-background-color);border:none;border-top-left-radius:.3rem;border-top-right-radius:.3rem;display:flex;padding:.3rem .3rem 0;flex-direction:column;cursor:var(--bizy-input-cursor)}.bizy-input--negative,.bizy-input--negative .bizy-input__header,.bizy-input--negative .bizy-input__content,.bizy-input--negative .bizy-input__content__input{background-color:var(--bizy-input-negative-background-color)}.bizy-input--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-input__header{background-color:var(--bizy-input-background-color);width:100%;display:flex;align-items:center;column-gap:.5rem;padding-bottom:.1rem}.bizy-input__header:empty{display:none!important}.bizy-input__content{background-color:var(--bizy-input-background-color);width:100%;display:flex;align-items:center;column-gap:.3rem}.bizy-input__content--readonly{pointer-events:none;cursor:default!important}.bizy-input__content__prefix{display:flex;align-items:center;column-gap:.3rem}.bizy-input__content__prefix:empty{display:none!important}.bizy-input__content__suffix{display:flex;align-items:center;column-gap:.3rem}.bizy-input__content__suffix:empty{display:none!important}.bizy-input__content__input{width:100%;background-color:var(--bizy-input-background-color);color:var(--bizy-input-color);flex:1;border:none;padding-block:0;padding-inline:0;padding:0 0 .2rem;font-size:var(--bizy-input-font-size)}.bizy-input__content__input:focus{outline:none;border:none}.bizy-input__content__input::placeholder{color:var(--bizy-input-placeholder-color)}.bizy-input__content input[type=number]::-webkit-inner-spin-button,.bizy-input__content input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.bizy-input__bottom-line{width:calc(100% + .6rem);position:relative;right:.3rem;height:.1rem;visibility:hidden;pointer-events:none;background-color:var(--bizy-input-focus-color)}.bizy-input__bottom-line--visible{visibility:visible;animation-name:zoomIn;animation-duration:.2s;animation-fill-mode:both}.bizy-input__options{background-color:var(--bizy-input-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-input-options-height);overflow-y:auto;overflow-x:hidden;position:relative}.bizy-input__errors:empty{display:none!important}::ng-deep .bizy-input__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: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], 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: "directive", type: BizyCurrencyFormatDirective, selector: "[bizyCurrencyFormat]", inputs: ["bizyCurrencyFormat", "bizyCurrencyOptions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
11697
11687
|
}
|
|
11698
11688
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyInputComponent, decorators: [{
|
|
11699
11689
|
type: Component,
|
|
@@ -11708,8 +11698,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImpor
|
|
|
11708
11698
|
type: Input
|
|
11709
11699
|
}], name: [{
|
|
11710
11700
|
type: Input
|
|
11711
|
-
}], type: [{
|
|
11712
|
-
type: Input
|
|
11713
11701
|
}], customClass: [{
|
|
11714
11702
|
type: Input
|
|
11715
11703
|
}], placeholder: [{
|
|
@@ -11718,6 +11706,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImpor
|
|
|
11718
11706
|
type: Input
|
|
11719
11707
|
}], rows: [{
|
|
11720
11708
|
type: Input
|
|
11709
|
+
}], type: [{
|
|
11710
|
+
type: Input
|
|
11721
11711
|
}], maxLength: [{
|
|
11722
11712
|
type: Input
|
|
11723
11713
|
}], autofocus: [{
|
|
@@ -11908,7 +11898,7 @@ class BizyDatePickerComponent {
|
|
|
11908
11898
|
return date.getMinutes();
|
|
11909
11899
|
}
|
|
11910
11900
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyDatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11911
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: BizyDatePickerComponent, isStandalone: true, selector: "bizy-date-picker", inputs: { id: "id", disabled: "disabled", customClass: "customClass", opened: "opened", minDate: "minDate", maxDate: "maxDate", enableSeconds: "enableSeconds", date: "date", range: "range", type: "type" }, outputs: { dateChange: "dateChange", rangeChange: "rangeChange", onChange: "onChange", openedChange: "openedChange", onOpen: "onOpen", onSelect: "onSelect" }, providers: [DatePipe], viewQueries: [{ propertyName: "bizyDatePicker", first: true, predicate: ["bizyDatePicker"], descendants: true }], ngImport: i0, template: "<bizy-input\n #bizyDatePicker\n [readonly]=\"true\"\n [disabled]=\"disabled\"\n (onSelect)=\"onSelect.emit($event)\"\n [value]=\"value\"\n [id]=\"id\"\n class=\"bizy-date-picker {{customClass}}\">\n\n <svg\n slot=\"suffix\"\n id=\"bizy-date-picker-arrow\"\n class=\"bizy-date-picker__arrow\"\n [ngClass]=\"{'bizy-date-picker__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=\"suffix\">\n <ng-content select=\"[slot=prefix]\"></ng-content>\n </ng-container>\n\n @if (touched) {\n <ng-container slot=\"error\">\n <ng-content select=\"[slot=error]\"></ng-content>\n </ng-container>\n }\n\n</bizy-input>\n", styles: [":host{font-size:1rem;width:var(--bizy-input-width);min-width:var(--bizy-input-min-width);max-width:var(--bizy-input-max-width);display:flex}.bizy-date-picker{--bizy-input-cursor: pointer}.bizy-date-picker__arrow{height:1rem;pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-input-color)}.bizy-date-picker__arrow--opened{transform:rotate(180deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "
|
|
11901
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: BizyDatePickerComponent, isStandalone: true, selector: "bizy-date-picker", inputs: { id: "id", disabled: "disabled", customClass: "customClass", opened: "opened", minDate: "minDate", maxDate: "maxDate", enableSeconds: "enableSeconds", date: "date", range: "range", type: "type" }, outputs: { dateChange: "dateChange", rangeChange: "rangeChange", onChange: "onChange", openedChange: "openedChange", onOpen: "onOpen", onSelect: "onSelect" }, providers: [DatePipe], viewQueries: [{ propertyName: "bizyDatePicker", first: true, predicate: ["bizyDatePicker"], descendants: true }], ngImport: i0, template: "<bizy-input\n #bizyDatePicker\n [readonly]=\"true\"\n [disabled]=\"disabled\"\n (onSelect)=\"onSelect.emit($event)\"\n [value]=\"value\"\n [id]=\"id\"\n class=\"bizy-date-picker {{customClass}}\">\n\n <svg\n slot=\"suffix\"\n id=\"bizy-date-picker-arrow\"\n class=\"bizy-date-picker__arrow\"\n [ngClass]=\"{'bizy-date-picker__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=\"suffix\">\n <ng-content select=\"[slot=prefix]\"></ng-content>\n </ng-container>\n\n @if (touched) {\n <ng-container slot=\"error\">\n <ng-content select=\"[slot=error]\"></ng-content>\n </ng-container>\n }\n\n</bizy-input>\n", styles: [":host{font-size:1rem;width:var(--bizy-input-width);min-width:var(--bizy-input-min-width);max-width:var(--bizy-input-max-width);display:flex}.bizy-date-picker{--bizy-input-cursor: pointer}.bizy-date-picker__arrow{height:1rem;pointer-events:none;display:block;transition:transform .2s ease;fill:var(--bizy-input-color)}.bizy-date-picker__arrow--opened{transform:rotate(180deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "customClass", "placeholder", "debounceTime", "rows", "type", "maxLength", "autofocus", "disabled", "readonly", "value"], outputs: ["valueChange", "onChange", "onEnter", "onBackspace", "onSelect", "onBlur", "onFocus", "onPaste"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
11912
11902
|
}
|
|
11913
11903
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyDatePickerComponent, decorators: [{
|
|
11914
11904
|
type: Component,
|
|
@@ -12959,7 +12949,7 @@ class BizyFilterSectionRangeOptionComponent {
|
|
|
12959
12949
|
return this.#activated.value;
|
|
12960
12950
|
};
|
|
12961
12951
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyFilterSectionRangeOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12962
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: BizyFilterSectionRangeOptionComponent, isStandalone: true, selector: "bizy-filter-section-range-option", inputs: { id: "id", disabled: "disabled", customClass: "customClass", min: "min", max: "max", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div \n class=\"bizy-filter-section-range-option {{customClass}}\"\n [id]=\"id\">\n\n <span class=\"bizy-filter-section-range-option__inputs\">\n\n <bizy-input\n class=\"bizy-filter-section-range-option__input\"\n type=\"number\"\n [value]=\"minValue.value\"\n (onChange)=\"setMinValue($event)\">\n\n <ng-container slot=\"header\">\n <ng-content select=\"[slot=min-header]\"></ng-content>\n </ng-container>\n\n </bizy-input>\n\n <bizy-input\n class=\"bizy-filter-section-range-option__input\"\n type=\"number\"\n [value]=\"maxValue.value\"\n (onChange)=\"setMaxValue($event)\">\n\n <ng-container slot=\"header\">\n <ng-content select=\"[slot=max-header]\"></ng-content>\n </ng-container>\n\n </bizy-input>\n\n </span>\n \n</div>", styles: [":host{font-size:1rem}.bizy-filter-section-range-option{display:flex;flex-direction:column;row-gap:1rem}.bizy-filter-section-range-option__inputs{display:flex;align-items:center;column-gap:.5rem}.bizy-filter-section-range-option__input{--bizy-input-background-color: #f3f3f3 !important}\n"], dependencies: [{ kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "
|
|
12952
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: BizyFilterSectionRangeOptionComponent, isStandalone: true, selector: "bizy-filter-section-range-option", inputs: { id: "id", disabled: "disabled", customClass: "customClass", min: "min", max: "max", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div \n class=\"bizy-filter-section-range-option {{customClass}}\"\n [id]=\"id\">\n\n <span class=\"bizy-filter-section-range-option__inputs\">\n\n <bizy-input\n class=\"bizy-filter-section-range-option__input\"\n type=\"number\"\n [value]=\"minValue.value\"\n (onChange)=\"setMinValue($event)\">\n\n <ng-container slot=\"header\">\n <ng-content select=\"[slot=min-header]\"></ng-content>\n </ng-container>\n\n </bizy-input>\n\n <bizy-input\n class=\"bizy-filter-section-range-option__input\"\n type=\"number\"\n [value]=\"maxValue.value\"\n (onChange)=\"setMaxValue($event)\">\n\n <ng-container slot=\"header\">\n <ng-content select=\"[slot=max-header]\"></ng-content>\n </ng-container>\n\n </bizy-input>\n\n </span>\n \n</div>", styles: [":host{font-size:1rem}.bizy-filter-section-range-option{display:flex;flex-direction:column;row-gap:1rem}.bizy-filter-section-range-option__inputs{display:flex;align-items:center;column-gap:.5rem}.bizy-filter-section-range-option__input{--bizy-input-background-color: #f3f3f3 !important}\n"], dependencies: [{ kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "customClass", "placeholder", "debounceTime", "rows", "type", "maxLength", "autofocus", "disabled", "readonly", "value"], outputs: ["valueChange", "onChange", "onEnter", "onBackspace", "onSelect", "onBlur", "onFocus", "onPaste"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
12963
12953
|
}
|
|
12964
12954
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyFilterSectionRangeOptionComponent, decorators: [{
|
|
12965
12955
|
type: Component,
|
|
@@ -13073,7 +13063,7 @@ class BizyFilterSectionSearchOptionComponent {
|
|
|
13073
13063
|
return this.#activated.value;
|
|
13074
13064
|
};
|
|
13075
13065
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyFilterSectionSearchOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13076
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: BizyFilterSectionSearchOptionComponent, isStandalone: true, selector: "bizy-filter-section-search-option", inputs: { id: "id", customClass: "customClass", value: "value" }, outputs: { valueChange: "valueChange", onChange: "onChange" }, ngImport: i0, template: "<bizy-input\n [id]=\"id\" \n (onChange)=\"_onChange($event)\"\n [value]=\"_value\"\n class=\"bizy-filter-section-search-option {{customClass}}\">\n\n <span slot=\"header\"></span>\n\n <ng-container slot=\"prefix\">\n <ng-content select=\"[slot=prefix]\"></ng-content>\n </ng-container>\n\n <ng-container slot=\"suffix\">\n <ng-content select=\"[slot=suffix]\"></ng-content>\n </ng-container>\n\n</bizy-input>\n", styles: [":host{font-size:1rem;width:100%}.bizy-filter-section-search-option{--bizy-input-background-color: #f3f3f3 !important}\n"], dependencies: [{ kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "
|
|
13066
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: BizyFilterSectionSearchOptionComponent, isStandalone: true, selector: "bizy-filter-section-search-option", inputs: { id: "id", customClass: "customClass", value: "value" }, outputs: { valueChange: "valueChange", onChange: "onChange" }, ngImport: i0, template: "<bizy-input\n [id]=\"id\" \n (onChange)=\"_onChange($event)\"\n [value]=\"_value\"\n class=\"bizy-filter-section-search-option {{customClass}}\">\n\n <span slot=\"header\"></span>\n\n <ng-container slot=\"prefix\">\n <ng-content select=\"[slot=prefix]\"></ng-content>\n </ng-container>\n\n <ng-container slot=\"suffix\">\n <ng-content select=\"[slot=suffix]\"></ng-content>\n </ng-container>\n\n</bizy-input>\n", styles: [":host{font-size:1rem;width:100%}.bizy-filter-section-search-option{--bizy-input-background-color: #f3f3f3 !important}\n"], dependencies: [{ kind: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "customClass", "placeholder", "debounceTime", "rows", "type", "maxLength", "autofocus", "disabled", "readonly", "value"], outputs: ["valueChange", "onChange", "onEnter", "onBackspace", "onSelect", "onBlur", "onFocus", "onPaste"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
13077
13067
|
}
|
|
13078
13068
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyFilterSectionSearchOptionComponent, decorators: [{
|
|
13079
13069
|
type: Component,
|
|
@@ -13708,7 +13698,7 @@ class BizySelectComponent {
|
|
|
13708
13698
|
this.#contentChildrenSubscription.unsubscribe();
|
|
13709
13699
|
}
|
|
13710
13700
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizySelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13711
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", 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 @if (!readonly) {\n <svg\n slot=\"suffix\"\n id=\"bizy-select-arrow\"\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\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@if (touched) {\n <span class=\"bizy-select__errors\">\n <ng-content select=\"[slot=error]\"></ng-content>\n </span>\n}\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: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "
|
|
13701
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", 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 @if (!readonly) {\n <svg\n slot=\"suffix\"\n id=\"bizy-select-arrow\"\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\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@if (touched) {\n <span class=\"bizy-select__errors\">\n <ng-content select=\"[slot=error]\"></ng-content>\n </span>\n}\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: "component", type: BizyInputComponent, selector: "bizy-input", inputs: ["id", "name", "customClass", "placeholder", "debounceTime", "rows", "type", "maxLength", "autofocus", "disabled", "readonly", "value"], outputs: ["valueChange", "onChange", "onEnter", "onBackspace", "onSelect", "onBlur", "onFocus", "onPaste"] }, { 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", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], 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 });
|
|
13712
13702
|
}
|
|
13713
13703
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizySelectComponent, decorators: [{
|
|
13714
13704
|
type: Component,
|
|
@@ -14276,41 +14266,34 @@ class BizyGridComponent {
|
|
|
14276
14266
|
items = [];
|
|
14277
14267
|
itemTemplate;
|
|
14278
14268
|
itemsPerRow = 1;
|
|
14269
|
+
getNativeElement = () => this.#elementRef?.nativeElement;
|
|
14279
14270
|
ngAfterContentInit() {
|
|
14280
|
-
|
|
14281
|
-
this
|
|
14282
|
-
}
|
|
14283
|
-
else {
|
|
14284
|
-
this.#rowScrollingMutationObserver = new MutationObserver(() => {
|
|
14285
|
-
if (!this.gridDirective) {
|
|
14286
|
-
return;
|
|
14287
|
-
}
|
|
14288
|
-
this.#initView();
|
|
14289
|
-
this.#rowScrollingMutationObserver.disconnect();
|
|
14290
|
-
this.#ref.detectChanges();
|
|
14291
|
-
});
|
|
14292
|
-
this.#rowScrollingMutationObserver.observe(this.#document.body, { childList: true, subtree: true });
|
|
14293
|
-
}
|
|
14294
|
-
}
|
|
14295
|
-
#initView = () => {
|
|
14296
|
-
this.#subscription.add(this.gridDirective.items$.subscribe(items => {
|
|
14297
|
-
if (this.items.length === 0 && items.length === 0) {
|
|
14271
|
+
this.#rowScrollingMutationObserver = new MutationObserver(() => {
|
|
14272
|
+
if (!this.gridDirective) {
|
|
14298
14273
|
return;
|
|
14299
14274
|
}
|
|
14300
|
-
this.items
|
|
14301
|
-
|
|
14302
|
-
|
|
14303
|
-
|
|
14304
|
-
|
|
14305
|
-
|
|
14306
|
-
|
|
14275
|
+
this.#subscription.add(this.gridDirective.items$.subscribe(items => {
|
|
14276
|
+
if (this.items.length === 0 && items.length === 0) {
|
|
14277
|
+
return;
|
|
14278
|
+
}
|
|
14279
|
+
this.items = items;
|
|
14280
|
+
this.#updateView();
|
|
14281
|
+
if (!this.#view) {
|
|
14282
|
+
this.#view = this.gridDirective.viewContainerRef;
|
|
14283
|
+
this.#view.createEmbeddedView(this.content);
|
|
14284
|
+
}
|
|
14285
|
+
}));
|
|
14286
|
+
this.#rowScrollingMutationObserver.disconnect();
|
|
14287
|
+
this.#ref.detectChanges();
|
|
14288
|
+
});
|
|
14289
|
+
this.#rowScrollingMutationObserver.observe(this.#document.body, { childList: true, subtree: true });
|
|
14307
14290
|
this.#resizeObserver = new ResizeObserver(() => this.notifier$.next());
|
|
14308
14291
|
const resizeRef = this.resizeRef ? this.resizeRef : this.#renderer.parentNode(this.#elementRef.nativeElement) ? this.#renderer.parentNode(this.#elementRef.nativeElement) : this.#elementRef.nativeElement;
|
|
14309
14292
|
this.#resizeObserver.observe(resizeRef);
|
|
14310
14293
|
this.#subscription.add(this.notifier$.pipe(debounceTime(50)).subscribe(() => {
|
|
14311
14294
|
this.#updateView();
|
|
14312
14295
|
}));
|
|
14313
|
-
}
|
|
14296
|
+
}
|
|
14314
14297
|
#updateView = () => {
|
|
14315
14298
|
this.itemTemplate = this.gridDirective.templateRef;
|
|
14316
14299
|
const rowWidth = this.#elementRef.nativeElement.offsetWidth || this.#elementRef.nativeElement.firstChild.offsetWidth;
|
|
@@ -14339,21 +14322,31 @@ class BizyGridComponent {
|
|
|
14339
14322
|
columnWidth = Number(columnWidthParameter.split('px')[0]);
|
|
14340
14323
|
}
|
|
14341
14324
|
columnWidth += gap;
|
|
14325
|
+
let newItemsPerRow = 0;
|
|
14342
14326
|
const count = Math.trunc(rowWidth / (columnWidth));
|
|
14343
14327
|
if (Math.round((gap * (count - 1)) + (columnWidth * count)) <= (rowWidth)) {
|
|
14344
|
-
|
|
14328
|
+
newItemsPerRow = count <= 0 ? 1 : count;
|
|
14345
14329
|
}
|
|
14346
14330
|
else {
|
|
14347
|
-
|
|
14348
|
-
}
|
|
14349
|
-
|
|
14350
|
-
|
|
14351
|
-
const
|
|
14352
|
-
|
|
14331
|
+
newItemsPerRow = (count - 1) <= 0 ? 1 : count - 1;
|
|
14332
|
+
}
|
|
14333
|
+
if (newItemsPerRow !== this.itemsPerRow || this.items.length !== (this.itemRows.length * this.itemsPerRow)) {
|
|
14334
|
+
this.itemsPerRow = newItemsPerRow;
|
|
14335
|
+
const itemRows = [];
|
|
14336
|
+
for (let i = 0; i < this.items.length; i += this.itemsPerRow) {
|
|
14337
|
+
const row = this.items.slice(i, i + this.itemsPerRow);
|
|
14338
|
+
itemRows.push(row);
|
|
14339
|
+
}
|
|
14340
|
+
this.itemRows = itemRows;
|
|
14341
|
+
this.#ref.detectChanges();
|
|
14353
14342
|
}
|
|
14354
|
-
this.itemRows = itemRows;
|
|
14355
|
-
this.#ref.detectChanges();
|
|
14356
14343
|
};
|
|
14344
|
+
trackByRow(index, row) {
|
|
14345
|
+
if (row && row.length > 0) {
|
|
14346
|
+
return row[0].id;
|
|
14347
|
+
}
|
|
14348
|
+
return index;
|
|
14349
|
+
}
|
|
14357
14350
|
scrollTo(index, behavior = 'smooth') {
|
|
14358
14351
|
this.virtualScroll.scrollToIndex(index, behavior);
|
|
14359
14352
|
}
|
|
@@ -14366,13 +14359,12 @@ class BizyGridComponent {
|
|
|
14366
14359
|
this.#resizeObserver.disconnect();
|
|
14367
14360
|
}
|
|
14368
14361
|
}
|
|
14369
|
-
getNativeElement = () => this.#elementRef?.nativeElement;
|
|
14370
14362
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
14371
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: BizyGridComponent, isStandalone: true, selector: "bizy-grid", inputs: { resizeRef: "resizeRef" }, queries: [{ propertyName: "gridDirective", first: true, predicate: BizyGridForDirective, descendants: true }], viewQueries: [{ propertyName: "virtualScroll", first: true, predicate: ["cdkVirtualScroll"], descendants: true }, { 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 #cdkVirtualScroll\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\n let-item\n let-index=\"index\"\n let-first=\"first\"\n let-last=\"last\"\n let-even=\"even\"\n let-odd=\"odd\"\n cdkVirtualFor\n [cdkVirtualForOf]=\"itemRows\">\n <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n @for (it of item; track it.id ?? i; let i = $index) {\n <ng-template\n
|
|
14363
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: BizyGridComponent, isStandalone: true, selector: "bizy-grid", inputs: { resizeRef: "resizeRef" }, queries: [{ propertyName: "gridDirective", first: true, predicate: BizyGridForDirective, descendants: true }], viewQueries: [{ propertyName: "virtualScroll", first: true, predicate: ["cdkVirtualScroll"], descendants: true }, { 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 #cdkVirtualScroll\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\n let-item\n let-index=\"index\"\n let-first=\"first\"\n let-last=\"last\"\n let-even=\"even\"\n let-odd=\"odd\"\n cdkVirtualFor\n [cdkVirtualForOf]=\"itemRows\"\n [cdkVirtualForTrackBy]=\"trackByRow\">\n <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n @for (it of item; track it.id ?? i; let i = $index) {\n <ng-template\n *ngTemplateOutlet=\"itemTemplate;\n context: { \n $implicit: it,\n index: index * itemsPerRow + i,\n rowIndex: index,\n rowFirst: first,\n rowLast: last,\n rowEven: even,\n rowOdd: odd\n }\">\n </ng-template>\n }\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.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 });
|
|
14372
14364
|
}
|
|
14373
14365
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: BizyGridComponent, decorators: [{
|
|
14374
14366
|
type: Component,
|
|
14375
|
-
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 #cdkVirtualScroll\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\n let-item\n let-index=\"index\"\n let-first=\"first\"\n let-last=\"last\"\n let-even=\"even\"\n let-odd=\"odd\"\n cdkVirtualFor\n [cdkVirtualForOf]=\"itemRows\">\n <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n @for (it of item; track it.id ?? i; let i = $index) {\n <ng-template\n
|
|
14367
|
+
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 #cdkVirtualScroll\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\n let-item\n let-index=\"index\"\n let-first=\"first\"\n let-last=\"last\"\n let-even=\"even\"\n let-odd=\"odd\"\n cdkVirtualFor\n [cdkVirtualForOf]=\"itemRows\"\n [cdkVirtualForTrackBy]=\"trackByRow\">\n <bizy-grid-row [rowHeight]=\"rowHeight\" [itemsPerRow]=\"itemsPerRow\">\n @for (it of item; track it.id ?? i; let i = $index) {\n <ng-template\n *ngTemplateOutlet=\"itemTemplate;\n context: { \n $implicit: it,\n index: index * itemsPerRow + i,\n rowIndex: index,\n rowFirst: first,\n rowLast: last,\n rowEven: even,\n rowOdd: odd\n }\">\n </ng-template>\n }\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"] }]
|
|
14376
14368
|
}], propDecorators: { virtualScroll: [{
|
|
14377
14369
|
type: ViewChild,
|
|
14378
14370
|
args: ['cdkVirtualScroll']
|