@solcre-org/core-ui 2.17.4 → 2.17.5
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.
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
--_padd-x: 1em;
|
|
62
62
|
--_br: .5em;
|
|
63
63
|
--_tooltip-parent-separation: 8px;
|
|
64
|
-
--_max-width:
|
|
64
|
+
--_max-width: 10em;
|
|
65
65
|
|
|
66
66
|
position: absolute;
|
|
67
67
|
background-color: hsl(var(--_color-main-hsl));
|
|
@@ -71,6 +71,8 @@
|
|
|
71
71
|
font-size: var(--_fz);
|
|
72
72
|
width: max-content;
|
|
73
73
|
max-width: var(--_max-width);
|
|
74
|
+
overflow: hidden;
|
|
75
|
+
overflow-wrap: break-word;
|
|
74
76
|
opacity: 0;
|
|
75
77
|
transition: opacity 0.3s ease;
|
|
76
78
|
z-index: 1000;
|
|
@@ -1112,11 +1112,11 @@ class DatetimeFieldComponent {
|
|
|
1112
1112
|
}
|
|
1113
1113
|
}
|
|
1114
1114
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DatetimeFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1115
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DatetimeFieldComponent, isStandalone: true, selector: "core-datetime-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, rowData: { classPropertyName: "rowData", publicName: "rowData", isSignal: true, isRequired: false, transformFunction: null }, formValue: { classPropertyName: "formValue", publicName: "formValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", onBlurEvent: "onBlurEvent", onEnterEvent: "onEnterEvent" }, usesOnChanges: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <label class=\"c-entry-text\" *ngIf=\"field().label\" [for]=\"field().key.toString()\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n <div class=\"c-entry-datetime\">\n <span class=\"c-entry-input\" [class.is-invalid]=\"hasError()\">\n <input\n type=\"date\"\n [id]=\"field().key.toString()\"\n [name]=\"field().key.toString()\"\n [value]=\"formattedDate()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onDateChange($event)\"\n (blur)=\"onBlur()\"\n (keydown.enter)=\"onEnter($any($event))\"\n />\n <button class=\"c-entry-input__addon icon-calendar-thin\" \n tabindex=\"-1\"\n type=\"button\"\n (click)=\"onCalendarClick($event)\"></button>\n </span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"hoursOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedHour()\"\n (ngModelChange)=\"onHourChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isHourPlaceholderVisible() ? 'HH' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n <span class=\"c-entry-datetime__separator\">:</span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"minutesOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedMinute()\"\n (ngModelChange)=\"onMinuteChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isMinutePlaceholderVisible() ? 'MM' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>\n\n\n", styles: [".ng-select .ng-select-container .ng-value-container{flex-wrap:wrap}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{color:var(--_entry-input-placeholder-color);opacity:1}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input{color:var(--_entry-input-placeholder-color)}.c-entry-input--ng-select:not(.is-placeholder) ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{opacity:0}::ng-deep .ng-select{width:100%!important;display:contents}.c-entry-input--ng-select{position:relative}.ng-dropdown-panel{width:auto!important}::ng-deep .ng-dropdown-panel{width:auto!important;top:0;right:-1rem}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value{background-color:var(--form-highlighted-color, var(--color-neutral-300));color:#3f4e6a;border-radius:var(--_entry-input-br);padding:.2em .8em;margin:.2em;border:none;border-radius:4px}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{border:none;padding-right:.4em;color:#3f4e6a}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items{border:none;min-height:auto;padding:0;position:relative;right:0;margin-top:3em;box-shadow:1em 2.4em 3.4em -2em hsl(var(--color-neutral-900-hsl)/25%);background-color:var(--color-neutral-100)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{padding:.6em .8em;color:#6a788c;cursor:pointer;transition:background-color .1s ease-out}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{color:var(--color-primary-400)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:var(--color-primary-400);font-weight:500}::ng-deep .ng-dropdown-panel .scrollable-content{background:var(--color-neutral-300)}::ng-deep .ng-dropdown-panel-items.scroll-host{background:var(--color-neutral-300);padding:1em;border-radius:var(--_entry-input-br)}::ng-deep app-server-select-field .ng-select:not(.ng-select-filtered):not(.ng-select-opened) .ng-dropdown-panel{opacity:0!important}::ng-deep .c-entry-input--ng-select{--_entry-input-padd-y: .76em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value){--_entry-input-padd-y: .35em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input{margin-left:8px}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-notfound){background-color:hsl(from hsl(var(--color-context-error-hsl)) h s 94%);color:hsl(from hsl(var(--color-context-error-hsl)) h s 60%)}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-loading){background-color:hsl(from hsl(var(--color-alternative-800-hsl)) h s 96%);color:hsl(from hsl(var(--color-alternative-800-hsl)) h 90% 70%)}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container{display:grid;justify-content:start}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{height:-webkit-fill-available}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{height:98%}::ng-deep .ng-select.ng-select-single .ng-select-container{overflow:visible;position:relative;cursor:pointer}::ng-deep .ng-select.ng-select-single .ng-select-container:before{content:\"\";position:absolute;left:calc(var(--_entry-input-padd-x) * -1);right:calc(var(--_entry-input-padd-x) * -1 - var(--_entry-input-addon-gap) - var(--_entry-input-addon-icon-fz));top:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1);bottom:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1)}::ng-deep .ng-select .ng-clear-wrapper .ng-clear{position:absolute;top:50%;transform:translateY(-50%)}@media (hover: hover){::ng-deep .ng-select .ng-clear-wrapper:is(:hover,:focus-visible){color:var(--color-hover)}}.c-entry-input--ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled .ng-select-container{background-color:var(--color-neutral-100, #f5f5f5);cursor:not-allowed}::ng-deep .ng-select.disabled .ng-select-container .ng-value-container .ng-input input{cursor:not-allowed}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
1115
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DatetimeFieldComponent, isStandalone: true, selector: "core-datetime-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, rowData: { classPropertyName: "rowData", publicName: "rowData", isSignal: true, isRequired: false, transformFunction: null }, formValue: { classPropertyName: "formValue", publicName: "formValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", onBlurEvent: "onBlurEvent", onEnterEvent: "onEnterEvent" }, usesOnChanges: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <label class=\"c-entry-text\" *ngIf=\"field().label\" [for]=\"field().key.toString()\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n <div class=\"c-entry-datetime\">\n <span class=\"c-entry-input\" [class.is-invalid]=\"hasError()\">\n <input\n type=\"date\"\n [id]=\"field().key.toString()\"\n [name]=\"field().key.toString()\"\n [value]=\"formattedDate()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onDateChange($event)\"\n (blur)=\"onBlur()\"\n (keydown.enter)=\"onEnter($any($event))\"\n />\n <button class=\"c-entry-input__addon icon-calendar-thin\" \n tabindex=\"-1\"\n type=\"button\"\n (click)=\"onCalendarClick($event)\"></button>\n </span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"hoursOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedHour()\"\n (ngModelChange)=\"onHourChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isHourPlaceholderVisible() ? 'HH' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n <span class=\"c-entry-datetime__separator\">:</span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"minutesOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedMinute()\"\n (ngModelChange)=\"onMinuteChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isMinutePlaceholderVisible() ? 'MM' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>\n\n\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
1116
1116
|
}
|
|
1117
1117
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DatetimeFieldComponent, decorators: [{
|
|
1118
1118
|
type: Component,
|
|
1119
|
-
args: [{ selector: 'core-datetime-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <label class=\"c-entry-text\" *ngIf=\"field().label\" [for]=\"field().key.toString()\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n <div class=\"c-entry-datetime\">\n <span class=\"c-entry-input\" [class.is-invalid]=\"hasError()\">\n <input\n type=\"date\"\n [id]=\"field().key.toString()\"\n [name]=\"field().key.toString()\"\n [value]=\"formattedDate()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onDateChange($event)\"\n (blur)=\"onBlur()\"\n (keydown.enter)=\"onEnter($any($event))\"\n />\n <button class=\"c-entry-input__addon icon-calendar-thin\" \n tabindex=\"-1\"\n type=\"button\"\n (click)=\"onCalendarClick($event)\"></button>\n </span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"hoursOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedHour()\"\n (ngModelChange)=\"onHourChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isHourPlaceholderVisible() ? 'HH' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n <span class=\"c-entry-datetime__separator\">:</span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"minutesOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedMinute()\"\n (ngModelChange)=\"onMinuteChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isMinutePlaceholderVisible() ? 'MM' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>\n\n\n"
|
|
1119
|
+
args: [{ selector: 'core-datetime-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <label class=\"c-entry-text\" *ngIf=\"field().label\" [for]=\"field().key.toString()\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n <div class=\"c-entry-datetime\">\n <span class=\"c-entry-input\" [class.is-invalid]=\"hasError()\">\n <input\n type=\"date\"\n [id]=\"field().key.toString()\"\n [name]=\"field().key.toString()\"\n [value]=\"formattedDate()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onDateChange($event)\"\n (blur)=\"onBlur()\"\n (keydown.enter)=\"onEnter($any($event))\"\n />\n <button class=\"c-entry-input__addon icon-calendar-thin\" \n tabindex=\"-1\"\n type=\"button\"\n (click)=\"onCalendarClick($event)\"></button>\n </span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"hoursOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedHour()\"\n (ngModelChange)=\"onHourChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isHourPlaceholderVisible() ? 'HH' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n <span class=\"c-entry-datetime__separator\">:</span>\n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasError()\">\n <ng-select\n [items]=\"minutesOptions()\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [ngModel]=\"selectedMinute()\"\n (ngModelChange)=\"onMinuteChange($event)\"\n [disabled]=\"isDisabled()\"\n [clearable]=\"false\"\n [searchable]=\"false\"\n (blur)=\"onBlur()\"\n [placeholder]=\"isMinutePlaceholderVisible() ? 'MM' : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>\n\n\n" }]
|
|
1120
1120
|
}], ctorParameters: () => [] });
|
|
1121
1121
|
|
|
1122
1122
|
var DocumentPayloadMode;
|
|
@@ -3820,11 +3820,11 @@ class SelectFieldComponent extends BaseFieldComponent {
|
|
|
3820
3820
|
this.hasValue.set(false);
|
|
3821
3821
|
}
|
|
3822
3822
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SelectFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3823
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SelectFieldComponent, isStandalone: true, selector: "core-select-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "ngSelect", first: true, predicate: NgSelectComponent, descendants: true }], usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <div class=\"c-entry-input c-entry-input--ng-select c-entry-input--ng-select-alt\"\n [class.is-placeholder]=\"isPlaceholderVisible()\"\n [class.is-invalid]=\"hasError()\"\n [class.disabled]=\"isDisabled()\">\n <ng-select\n [items]=\"field().options ?? []\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [class.disabled]=\"isDisabled()\"\n [readonly]=\"isReadonly()\"\n [clearable]=\"true\"\n [searchable]=\"isSearchable()\"\n (blur)=\"onBlurInput()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? '') | translate) : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\">\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-notfound-tmp>\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>", styles: [".ng-select .ng-select-container .ng-value-container{flex-wrap:wrap}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{color:var(--_entry-input-placeholder-color);opacity:1}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input{color:var(--_entry-input-placeholder-color)}.c-entry-input--ng-select:not(.is-placeholder) ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{opacity:0}::ng-deep .ng-select{width:100%!important;display:contents}.c-entry-input--ng-select{position:relative}.ng-dropdown-panel{width:auto!important}::ng-deep .ng-dropdown-panel{top:0;right:0}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value{background-color:var(--form-highlighted-color, var(--color-neutral-300));color:#3f4e6a;border-radius:var(--_entry-input-br);padding:.2em .8em;margin:.2em;border:none;border-radius:4px}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{border:none;padding-right:.4em;color:#3f4e6a}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items{border:none;min-height:auto;padding:0;position:relative;right:0;margin-top:3em;box-shadow:1em 2.4em 3.4em -2em hsl(var(--color-neutral-900-hsl)/25%);background-color:var(--color-neutral-100)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{padding:.6em .8em;color:#6a788c;cursor:pointer;transition:background-color .1s ease-out}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{color:var(--color-primary-400)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:var(--color-primary-400);font-weight:500}::ng-deep .ng-dropdown-panel .scrollable-content{background:#f2f5fa}::ng-deep .ng-dropdown-panel-items.scroll-host{background:#f2f5fa;padding:1em;border-radius:var(--_entry-input-br)}::ng-deep app-server-select-field .ng-select:not(.ng-select-filtered):not(.ng-select-opened) .ng-dropdown-panel{opacity:0!important}::ng-deep .c-entry-input--ng-select{--_entry-input-padd-y: .76em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value){--_entry-input-padd-y: .35em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input{margin-left:8px}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-notfound){background-color:hsl(from hsl(var(--color-context-error-hsl)) h s 94%);color:hsl(from hsl(var(--color-context-error-hsl)) h s 60%)}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-loading){background-color:hsl(from hsl(var(--color-alternative-800-hsl)) h s 96%);color:hsl(from hsl(var(--color-alternative-800-hsl)) h 90% 70%)}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container{display:grid;justify-content:start}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{height:-webkit-fill-available}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{height:98%}::ng-deep .ng-select.ng-select-single .ng-select-container{overflow:visible;position:relative;cursor:pointer}::ng-deep .ng-select.ng-select-single .ng-select-container:before{content:\"\";position:absolute;left:calc(var(--_entry-input-padd-x) * -1);right:calc(var(--_entry-input-padd-x) * -1 - var(--_entry-input-addon-gap) - var(--_entry-input-addon-icon-fz));top:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1);bottom:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1)}::ng-deep .ng-select .ng-clear-wrapper .ng-clear{position:absolute;top:50%;transform:translateY(-50%)}@media (hover: hover){::ng-deep .ng-select .ng-clear-wrapper:is(:hover,:focus-visible){color:var(--color-hover)}}.c-entry-input--ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled .ng-select-container{background-color:var(--color-neutral-100, #f5f5f5);cursor:not-allowed}::ng-deep .ng-select.disabled .ng-select-container .ng-value-container .ng-input input{cursor:not-allowed}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i5.NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
3823
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SelectFieldComponent, isStandalone: true, selector: "core-select-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "ngSelect", first: true, predicate: NgSelectComponent, descendants: true }], usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <div class=\"c-entry-input c-entry-input--ng-select c-entry-input--ng-select-alt\"\n [class.is-placeholder]=\"isPlaceholderVisible()\"\n [class.is-invalid]=\"hasError()\"\n [class.disabled]=\"isDisabled()\">\n <ng-select\n [items]=\"field().options ?? []\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [class.disabled]=\"isDisabled()\"\n [readonly]=\"isReadonly()\"\n [clearable]=\"true\"\n [searchable]=\"isSearchable()\"\n (blur)=\"onBlurInput()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? '') | translate) : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\">\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-notfound-tmp>\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>", styles: [".ng-select .ng-select-container .ng-value-container{flex-wrap:wrap}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{color:var(--_entry-input-placeholder-color);opacity:1}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input{color:var(--_entry-input-placeholder-color)}.c-entry-input--ng-select:not(.is-placeholder) ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{opacity:0}::ng-deep .ng-select{width:100%!important;display:contents}.c-entry-input--ng-select{position:relative}.ng-dropdown-panel{width:auto!important}::ng-deep .ng-dropdown-panel{top:0;right:0}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value{background-color:var(--form-highlighted-color, var(--color-neutral-300));color:#3f4e6a;border-radius:var(--_entry-input-br);padding:.2em .8em;margin:.2em;border:none;border-radius:4px}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{border:none;padding-right:.4em;color:#3f4e6a}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items{border:none;min-height:auto;padding:0;position:relative;right:0;margin-top:3em;box-shadow:1em 2.4em 3.4em -2em hsl(var(--color-neutral-900-hsl)/25%);background-color:var(--color-neutral-100)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{padding:.6em .8em;color:#6a788c;cursor:pointer;transition:background-color .1s ease-out}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{color:var(--color-primary-400)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:var(--color-primary-400);font-weight:500}::ng-deep .ng-dropdown-panel .scrollable-content{background:#f2f5fa}::ng-deep .ng-dropdown-panel-items.scroll-host{background:#f2f5fa;padding:1em;border-radius:var(--_entry-input-br)}::ng-deep app-server-select-field .ng-select:not(.ng-select-filtered):not(.ng-select-opened) .ng-dropdown-panel{opacity:0!important}::ng-deep .c-entry-input--ng-select{--_entry-input-padd-y: .76em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value){--_entry-input-padd-y: .35em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input{margin-left:8px;z-index:0}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-notfound){background-color:hsl(from hsl(var(--color-context-error-hsl)) h s 94%);color:hsl(from hsl(var(--color-context-error-hsl)) h s 60%)}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-loading){background-color:hsl(from hsl(var(--color-alternative-800-hsl)) h s 96%);color:hsl(from hsl(var(--color-alternative-800-hsl)) h 90% 70%)}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container{display:grid;justify-content:start}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{height:-webkit-fill-available}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{height:98%}::ng-deep .ng-select.ng-select-single .ng-select-container{overflow:visible;position:relative;cursor:pointer}::ng-deep .ng-select.ng-select-single .ng-select-container:before{content:\"\";position:absolute;left:calc(var(--_entry-input-padd-x) * -1);right:calc(var(--_entry-input-padd-x) * -1 - var(--_entry-input-addon-gap) - var(--_entry-input-addon-icon-fz));top:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1);bottom:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1)}::ng-deep .ng-select .ng-clear-wrapper .ng-clear{position:absolute;top:50%;transform:translateY(-50%)}@media (hover: hover){::ng-deep .ng-select .ng-clear-wrapper:is(:hover,:focus-visible){color:var(--color-hover)}}.c-entry-input--ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled .ng-select-container{background-color:var(--color-neutral-100, #f5f5f5);cursor:not-allowed}::ng-deep .ng-select.disabled .ng-select-container .ng-value-container .ng-input input{cursor:not-allowed}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i5.NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
3824
3824
|
}
|
|
3825
3825
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SelectFieldComponent, decorators: [{
|
|
3826
3826
|
type: Component,
|
|
3827
|
-
args: [{ selector: 'core-select-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <div class=\"c-entry-input c-entry-input--ng-select c-entry-input--ng-select-alt\"\n [class.is-placeholder]=\"isPlaceholderVisible()\"\n [class.is-invalid]=\"hasError()\"\n [class.disabled]=\"isDisabled()\">\n <ng-select\n [items]=\"field().options ?? []\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [class.disabled]=\"isDisabled()\"\n [readonly]=\"isReadonly()\"\n [clearable]=\"true\"\n [searchable]=\"isSearchable()\"\n (blur)=\"onBlurInput()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? '') | translate) : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\">\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-notfound-tmp>\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>", styles: [".ng-select .ng-select-container .ng-value-container{flex-wrap:wrap}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{color:var(--_entry-input-placeholder-color);opacity:1}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input{color:var(--_entry-input-placeholder-color)}.c-entry-input--ng-select:not(.is-placeholder) ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{opacity:0}::ng-deep .ng-select{width:100%!important;display:contents}.c-entry-input--ng-select{position:relative}.ng-dropdown-panel{width:auto!important}::ng-deep .ng-dropdown-panel{top:0;right:0}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value{background-color:var(--form-highlighted-color, var(--color-neutral-300));color:#3f4e6a;border-radius:var(--_entry-input-br);padding:.2em .8em;margin:.2em;border:none;border-radius:4px}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{border:none;padding-right:.4em;color:#3f4e6a}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items{border:none;min-height:auto;padding:0;position:relative;right:0;margin-top:3em;box-shadow:1em 2.4em 3.4em -2em hsl(var(--color-neutral-900-hsl)/25%);background-color:var(--color-neutral-100)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{padding:.6em .8em;color:#6a788c;cursor:pointer;transition:background-color .1s ease-out}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{color:var(--color-primary-400)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:var(--color-primary-400);font-weight:500}::ng-deep .ng-dropdown-panel .scrollable-content{background:#f2f5fa}::ng-deep .ng-dropdown-panel-items.scroll-host{background:#f2f5fa;padding:1em;border-radius:var(--_entry-input-br)}::ng-deep app-server-select-field .ng-select:not(.ng-select-filtered):not(.ng-select-opened) .ng-dropdown-panel{opacity:0!important}::ng-deep .c-entry-input--ng-select{--_entry-input-padd-y: .76em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value){--_entry-input-padd-y: .35em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input{margin-left:8px}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-notfound){background-color:hsl(from hsl(var(--color-context-error-hsl)) h s 94%);color:hsl(from hsl(var(--color-context-error-hsl)) h s 60%)}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-loading){background-color:hsl(from hsl(var(--color-alternative-800-hsl)) h s 96%);color:hsl(from hsl(var(--color-alternative-800-hsl)) h 90% 70%)}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container{display:grid;justify-content:start}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{height:-webkit-fill-available}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{height:98%}::ng-deep .ng-select.ng-select-single .ng-select-container{overflow:visible;position:relative;cursor:pointer}::ng-deep .ng-select.ng-select-single .ng-select-container:before{content:\"\";position:absolute;left:calc(var(--_entry-input-padd-x) * -1);right:calc(var(--_entry-input-padd-x) * -1 - var(--_entry-input-addon-gap) - var(--_entry-input-addon-icon-fz));top:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1);bottom:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1)}::ng-deep .ng-select .ng-clear-wrapper .ng-clear{position:absolute;top:50%;transform:translateY(-50%)}@media (hover: hover){::ng-deep .ng-select .ng-clear-wrapper:is(:hover,:focus-visible){color:var(--color-hover)}}.c-entry-input--ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled .ng-select-container{background-color:var(--color-neutral-100, #f5f5f5);cursor:not-allowed}::ng-deep .ng-select.disabled .ng-select-container .ng-value-container .ng-input input{cursor:not-allowed}\n"] }]
|
|
3827
|
+
args: [{ selector: 'core-select-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <div class=\"c-entry-input c-entry-input--ng-select c-entry-input--ng-select-alt\"\n [class.is-placeholder]=\"isPlaceholderVisible()\"\n [class.is-invalid]=\"hasError()\"\n [class.disabled]=\"isDisabled()\">\n <ng-select\n [items]=\"field().options ?? []\"\n bindValue=\"value\"\n bindLabel=\"label\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [class.disabled]=\"isDisabled()\"\n [readonly]=\"isReadonly()\"\n [clearable]=\"true\"\n [searchable]=\"isSearchable()\"\n (blur)=\"onBlurInput()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? '') | translate) : ''\"\n >\n <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\">\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ item.label | translate }}\n </ng-template>\n <ng-template ng-notfound-tmp>\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </div>\n <core-field-errors [errors]=\"errors()\" />\n</div>", styles: [".ng-select .ng-select-container .ng-value-container{flex-wrap:wrap}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{color:var(--_entry-input-placeholder-color);opacity:1}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input{color:var(--_entry-input-placeholder-color)}.c-entry-input--ng-select:not(.is-placeholder) ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{opacity:0}::ng-deep .ng-select{width:100%!important;display:contents}.c-entry-input--ng-select{position:relative}.ng-dropdown-panel{width:auto!important}::ng-deep .ng-dropdown-panel{top:0;right:0}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value{background-color:var(--form-highlighted-color, var(--color-neutral-300));color:#3f4e6a;border-radius:var(--_entry-input-br);padding:.2em .8em;margin:.2em;border:none;border-radius:4px}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{border:none;padding-right:.4em;color:#3f4e6a}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items{border:none;min-height:auto;padding:0;position:relative;right:0;margin-top:3em;box-shadow:1em 2.4em 3.4em -2em hsl(var(--color-neutral-900-hsl)/25%);background-color:var(--color-neutral-100)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{padding:.6em .8em;color:#6a788c;cursor:pointer;transition:background-color .1s ease-out}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{color:var(--color-primary-400)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:var(--color-primary-400);font-weight:500}::ng-deep .ng-dropdown-panel .scrollable-content{background:#f2f5fa}::ng-deep .ng-dropdown-panel-items.scroll-host{background:#f2f5fa;padding:1em;border-radius:var(--_entry-input-br)}::ng-deep app-server-select-field .ng-select:not(.ng-select-filtered):not(.ng-select-opened) .ng-dropdown-panel{opacity:0!important}::ng-deep .c-entry-input--ng-select{--_entry-input-padd-y: .76em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value){--_entry-input-padd-y: .35em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input{margin-left:8px;z-index:0}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-notfound){background-color:hsl(from hsl(var(--color-context-error-hsl)) h s 94%);color:hsl(from hsl(var(--color-context-error-hsl)) h s 60%)}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-loading){background-color:hsl(from hsl(var(--color-alternative-800-hsl)) h s 96%);color:hsl(from hsl(var(--color-alternative-800-hsl)) h 90% 70%)}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container{display:grid;justify-content:start}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{height:-webkit-fill-available}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{height:98%}::ng-deep .ng-select.ng-select-single .ng-select-container{overflow:visible;position:relative;cursor:pointer}::ng-deep .ng-select.ng-select-single .ng-select-container:before{content:\"\";position:absolute;left:calc(var(--_entry-input-padd-x) * -1);right:calc(var(--_entry-input-padd-x) * -1 - var(--_entry-input-addon-gap) - var(--_entry-input-addon-icon-fz));top:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1);bottom:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1)}::ng-deep .ng-select .ng-clear-wrapper .ng-clear{position:absolute;top:50%;transform:translateY(-50%)}@media (hover: hover){::ng-deep .ng-select .ng-clear-wrapper:is(:hover,:focus-visible){color:var(--color-hover)}}.c-entry-input--ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled{opacity:.6;pointer-events:none}::ng-deep .ng-select.disabled .ng-select-container{background-color:var(--color-neutral-100, #f5f5f5);cursor:not-allowed}::ng-deep .ng-select.disabled .ng-select-container .ng-value-container .ng-input input{cursor:not-allowed}\n"] }]
|
|
3828
3828
|
}], ctorParameters: () => [], propDecorators: { ngSelect: [{
|
|
3829
3829
|
type: ViewChild,
|
|
3830
3830
|
args: [NgSelectComponent]
|
|
@@ -4507,11 +4507,11 @@ class ServerSelectFieldComponent extends BaseFieldComponent {
|
|
|
4507
4507
|
}
|
|
4508
4508
|
}
|
|
4509
4509
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ServerSelectFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4510
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: ServerSelectFieldComponent, isStandalone: true, selector: "core-server-select-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["ngSelect"], descendants: true }], usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<!-- ! Solcre: Deberia ser el mismo componente que el select-field.component -->\n<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <!-- ! Solcre: El .c-entry-select deberia ser un componente en s\u00ED mismo -->\n <!-- ! Solcre: Sacar el .is-placeholder en el onChange -->\n \n <span class=\"c-entry-input c-entry-input--ng-select\"\n [class.is-placeholder]=\"isPlaceholderVisible()\">\n <!-- <div class=\"c-entry-select\"> -->\n \n <ng-select #ngSelect\n [items]=\"items()\"\n [bindValue]=\"field().bindValue ?? 'id'\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [readonly]=\"field().readonly\"\n [clearable]=\"!!value()\"\n [searchable]=\"isSearchable()\"\n [loading]=\"isLoading()\"\n [typeahead]=\"searchInput$\"\n (blur)=\"onBlurInput()\"\n (click)=\"onFieldClick()\"\n (beforeOpen)=\"onBeforeOpen()\"\n (open)=\"onOpen()\"\n (close)=\"onClose()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? 'commons.select.placeholder') | translate) : ''\"\n [virtualScroll]=\"true\"\n [clearable]=\"true\"\n >\n <!-- Estilos para cuando se clickea el select para buscar (si es conveniente dejarlo vac\u00EDo) -->\n <ng-template ng-typetosearch-tmp></ng-template>\n <ng-template ng-option-tmp let-item=\"item\">\n <!-- Estilos de opciones del select-->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-loadingtext-tmp>\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-template>\n <ng-template ng-notfound-tmp>\n <ng-container *ngIf=\"isLoading(); else noData\">\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-container>\n <ng-template #noData>\n <ng-container *ngIf=\"hasSearched(); else startTyping\">\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-container>\n <ng-template #startTyping>\n <span class=\"ng-select-start-typing\">{{ 'modal.field.serverSelect.typeToSearch' | translate }}</span>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-select>\n \n <!-- <span class=\"c-entry-select__arrow icon-arrow-down\"></span> -->\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span> <!-- .c-entry-select || .c-entry-input -->\n <core-field-errors [errors]=\"errors()\" />\n</div> <!-- .c-entry-item -->", styles: [".ng-select .ng-select-container .ng-value-container{flex-wrap:wrap}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{color:var(--_entry-input-placeholder-color);opacity:1}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input{color:var(--_entry-input-placeholder-color)}.c-entry-input--ng-select:not(.is-placeholder) ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{opacity:0}::ng-deep .ng-select{width:100%!important;display:contents}.c-entry-input--ng-select{position:relative}::ng-deep .ng-dropdown-panel{top:0;right:0}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value{background-color:var(--form-highlighted-color, var(--color-neutral-300));color:#3f4e6a;border-radius:var(--_entry-input-br);padding:.2em .8em;margin:.2em;border:none;border-radius:4px}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{border:none;padding-right:.4em;color:#3f4e6a}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items{border:none;min-height:auto;padding:0;position:relative;right:0;margin-top:3em;box-shadow:1em 2.4em 3.4em -2em hsl(var(--color-neutral-900-hsl)/25%);background-color:var(--color-neutral-100)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{padding:.6em .8em;color:#6a788c;cursor:pointer;transition:background-color .1s ease-out}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{color:var(--color-primary-400)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:var(--color-primary-400);font-weight:500}::ng-deep .ng-dropdown-panel .scrollable-content{background:#f2f5fa}::ng-deep .ng-dropdown-panel-items.scroll-host{background:#f2f5fa;padding:1em;border-radius:var(--_entry-input-br)}::ng-deep app-server-select-field .ng-select:not(.ng-select-filtered):not(.ng-select-opened) .ng-dropdown-panel{opacity:0!important}::ng-deep .c-entry-input--ng-select{--_entry-input-padd-y: .76em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value){--_entry-input-padd-y: .35em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input{margin-left:8px}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-notfound){background-color:hsl(from hsl(var(--color-context-error-hsl)) h s 94%);color:hsl(from hsl(var(--color-context-error-hsl)) h s 60%)}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-loading){background-color:hsl(from hsl(var(--color-alternative-800-hsl)) h s 96%);color:hsl(from hsl(var(--color-alternative-800-hsl)) h 90% 70%)}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container{display:grid;justify-content:start}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{height:-webkit-fill-available}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{height:98%}::ng-deep .ng-select.ng-select-single .ng-select-container{overflow:visible;position:relative;cursor:pointer}::ng-deep .ng-select.ng-select-single .ng-select-container:before{content:\"\";position:absolute;left:calc(var(--_entry-input-padd-x) * -1);right:calc(var(--_entry-input-padd-x) * -1 - var(--_entry-input-addon-gap) - var(--_entry-input-addon-icon-fz));top:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1);bottom:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1)}::ng-deep .ng-select .ng-clear-wrapper .ng-clear{position:absolute;top:50%;transform:translateY(-50%)}@media (hover: hover){::ng-deep .ng-select .ng-clear-wrapper:is(:hover,:focus-visible){color:var(--color-hover)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i5.NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]" }, { kind: "directive", type: i5.NgTypeToSearchTemplateDirective, selector: "[ng-typetosearch-tmp]" }, { kind: "directive", type: i5.NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
4510
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: ServerSelectFieldComponent, isStandalone: true, selector: "core-server-select-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["ngSelect"], descendants: true }], usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<!-- ! Solcre: Deberia ser el mismo componente que el select-field.component -->\n<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <!-- ! Solcre: El .c-entry-select deberia ser un componente en s\u00ED mismo -->\n <!-- ! Solcre: Sacar el .is-placeholder en el onChange -->\n \n <span class=\"c-entry-input c-entry-input--ng-select\"\n [class.is-placeholder]=\"isPlaceholderVisible()\">\n <!-- <div class=\"c-entry-select\"> -->\n \n <ng-select #ngSelect\n [items]=\"items()\"\n [bindValue]=\"field().bindValue ?? 'id'\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [readonly]=\"field().readonly\"\n [clearable]=\"!!value()\"\n [searchable]=\"isSearchable()\"\n [loading]=\"isLoading()\"\n [typeahead]=\"searchInput$\"\n (blur)=\"onBlurInput()\"\n (click)=\"onFieldClick()\"\n (beforeOpen)=\"onBeforeOpen()\"\n (open)=\"onOpen()\"\n (close)=\"onClose()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? 'commons.select.placeholder') | translate) : ''\"\n [virtualScroll]=\"true\"\n [clearable]=\"true\"\n >\n <!-- Estilos para cuando se clickea el select para buscar (si es conveniente dejarlo vac\u00EDo) -->\n <ng-template ng-typetosearch-tmp></ng-template>\n <ng-template ng-option-tmp let-item=\"item\">\n <!-- Estilos de opciones del select-->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-loadingtext-tmp>\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-template>\n <ng-template ng-notfound-tmp>\n <ng-container *ngIf=\"isLoading(); else noData\">\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-container>\n <ng-template #noData>\n <ng-container *ngIf=\"hasSearched(); else startTyping\">\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-container>\n <ng-template #startTyping>\n <span class=\"ng-select-start-typing\">{{ 'modal.field.serverSelect.typeToSearch' | translate }}</span>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-select>\n \n <!-- <span class=\"c-entry-select__arrow icon-arrow-down\"></span> -->\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span> <!-- .c-entry-select || .c-entry-input -->\n <core-field-errors [errors]=\"errors()\" />\n</div> <!-- .c-entry-item -->", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i5.NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]" }, { kind: "directive", type: i5.NgTypeToSearchTemplateDirective, selector: "[ng-typetosearch-tmp]" }, { kind: "directive", type: i5.NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
4511
4511
|
}
|
|
4512
4512
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ServerSelectFieldComponent, decorators: [{
|
|
4513
4513
|
type: Component,
|
|
4514
|
-
args: [{ selector: 'core-server-select-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<!-- ! Solcre: Deberia ser el mismo componente que el select-field.component -->\n<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <!-- ! Solcre: El .c-entry-select deberia ser un componente en s\u00ED mismo -->\n <!-- ! Solcre: Sacar el .is-placeholder en el onChange -->\n \n <span class=\"c-entry-input c-entry-input--ng-select\"\n [class.is-placeholder]=\"isPlaceholderVisible()\">\n <!-- <div class=\"c-entry-select\"> -->\n \n <ng-select #ngSelect\n [items]=\"items()\"\n [bindValue]=\"field().bindValue ?? 'id'\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [readonly]=\"field().readonly\"\n [clearable]=\"!!value()\"\n [searchable]=\"isSearchable()\"\n [loading]=\"isLoading()\"\n [typeahead]=\"searchInput$\"\n (blur)=\"onBlurInput()\"\n (click)=\"onFieldClick()\"\n (beforeOpen)=\"onBeforeOpen()\"\n (open)=\"onOpen()\"\n (close)=\"onClose()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? 'commons.select.placeholder') | translate) : ''\"\n [virtualScroll]=\"true\"\n [clearable]=\"true\"\n >\n <!-- Estilos para cuando se clickea el select para buscar (si es conveniente dejarlo vac\u00EDo) -->\n <ng-template ng-typetosearch-tmp></ng-template>\n <ng-template ng-option-tmp let-item=\"item\">\n <!-- Estilos de opciones del select-->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-loadingtext-tmp>\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-template>\n <ng-template ng-notfound-tmp>\n <ng-container *ngIf=\"isLoading(); else noData\">\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-container>\n <ng-template #noData>\n <ng-container *ngIf=\"hasSearched(); else startTyping\">\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-container>\n <ng-template #startTyping>\n <span class=\"ng-select-start-typing\">{{ 'modal.field.serverSelect.typeToSearch' | translate }}</span>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-select>\n \n <!-- <span class=\"c-entry-select__arrow icon-arrow-down\"></span> -->\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span> <!-- .c-entry-select || .c-entry-input -->\n <core-field-errors [errors]=\"errors()\" />\n</div> <!-- .c-entry-item -->"
|
|
4514
|
+
args: [{ selector: 'core-server-select-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<!-- ! Solcre: Deberia ser el mismo componente que el select-field.component -->\n<!-- Todo: Ng select + c-entry-select -->\n \n<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n <span class=\"c-entry-text\" *ngIf=\"field().label\">\n {{ field().label | translate }}\n @if (hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </span>\n \n <!-- ! Solcre: El .c-entry-select deberia ser un componente en s\u00ED mismo -->\n <!-- ! Solcre: Sacar el .is-placeholder en el onChange -->\n \n <span class=\"c-entry-input c-entry-input--ng-select\"\n [class.is-placeholder]=\"isPlaceholderVisible()\">\n <!-- <div class=\"c-entry-select\"> -->\n \n <ng-select #ngSelect\n [items]=\"items()\"\n [bindValue]=\"field().bindValue ?? 'id'\"\n [multiple]=\"field().multiple\"\n [formControl]=\"formControl()\"\n [compareWith]=\"compareWith\"\n [class.has-error]=\"hasError()\"\n [readonly]=\"field().readonly\"\n [clearable]=\"!!value()\"\n [searchable]=\"isSearchable()\"\n [loading]=\"isLoading()\"\n [typeahead]=\"searchInput$\"\n (blur)=\"onBlurInput()\"\n (click)=\"onFieldClick()\"\n (beforeOpen)=\"onBeforeOpen()\"\n (open)=\"onOpen()\"\n (close)=\"onClose()\"\n (change)=\"onSelectChange($event)\"\n (clear)=\"onSelectClear()\"\n [placeholder]=\"isPlaceholderVisible() ? ((field().placeholder ?? 'commons.select.placeholder') | translate) : ''\"\n [virtualScroll]=\"true\"\n [clearable]=\"true\"\n >\n <!-- Estilos para cuando se clickea el select para buscar (si es conveniente dejarlo vac\u00EDo) -->\n <ng-template ng-typetosearch-tmp></ng-template>\n <ng-template ng-option-tmp let-item=\"item\">\n <!-- Estilos de opciones del select-->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n <!-- Estilos que aparecen en la etiqueta del item seleccionado -->\n {{ getDisplayLabel(item) }}\n </ng-template>\n <ng-template ng-loadingtext-tmp>\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-template>\n <ng-template ng-notfound-tmp>\n <ng-container *ngIf=\"isLoading(); else noData\">\n <span class=\"ng-select-loading\">{{ 'commons.loading' | translate }}</span>\n </ng-container>\n <ng-template #noData>\n <ng-container *ngIf=\"hasSearched(); else startTyping\">\n <span class=\"ng-select-notfound\">{{ 'modal.field.serverSelect.noResults' | translate }}</span>\n </ng-container>\n <ng-template #startTyping>\n <span class=\"ng-select-start-typing\">{{ 'modal.field.serverSelect.typeToSearch' | translate }}</span>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-select>\n \n <!-- <span class=\"c-entry-select__arrow icon-arrow-down\"></span> -->\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span> <!-- .c-entry-select || .c-entry-input -->\n <core-field-errors [errors]=\"errors()\" />\n</div> <!-- .c-entry-item -->" }]
|
|
4515
4515
|
}], ctorParameters: () => [], propDecorators: { ngSelect: [{
|
|
4516
4516
|
type: ViewChild,
|
|
4517
4517
|
args: ['ngSelect']
|
|
@@ -5024,11 +5024,11 @@ class TimeFieldComponent {
|
|
|
5024
5024
|
}, 0);
|
|
5025
5025
|
}
|
|
5026
5026
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: TimeFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5027
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: TimeFieldComponent, isStandalone: true, selector: "core-time-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, rowData: { classPropertyName: "rowData", publicName: "rowData", isSignal: true, isRequired: false, transformFunction: null }, formValue: { classPropertyName: "formValue", publicName: "formValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", onBlurEvent: "onBlurEvent", onEnterEvent: "onEnterEvent" }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\" [class.time-field-range]=\"includeEndTime()\">\n <!-- Start Time Field -->\n <div class=\"time-field-container\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-start'\">\n {{ startTimeLabel() | translate }}\n @if (includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"includeEndTime() ? hasStartTimeError() : hasError()\">\n <ng-select\n [id]=\"field().key.toString() + '-start'\"\n [items]=\"startTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!(includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators())\"\n [disabled]=\"isDisabled()\"\n [ngModel]=\"selectedStartTime()\"\n (ngModelChange)=\"onStartTimeChange($event)\"\n (blur)=\"onStartTimeBlur()\"\n [placeholder]=\"isStartPlaceholderVisible() ? ('time-field.select-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- Start Time Individual Error Messages -->\n @if (includeEndTime() && hasStartTimeError()) {\n <core-field-errors [errors]=\"startTimeErrors()\"></core-field-errors>\n }\n </div>\n\n <!-- End Time Field (only if includeEndTime is true) -->\n @if (includeEndTime()) {\n <div class=\"time-field-container time-field-end\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-end'\">\n {{ endTimeLabel() | translate }}\n @if (hasEndTimeRequiredValidator()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasEndTimeError()\">\n <ng-select\n [id]=\"field().key.toString() + '-end'\"\n [items]=\"endTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!hasEndTimeRequiredValidator()\"\n [disabled]=\"isDisabled() || !selectedStartTime()\"\n [ngModel]=\"selectedEndTime()\"\n (ngModelChange)=\"onEndTimeChange($event)\"\n (blur)=\"onEndTimeBlur()\"\n [placeholder]=\"isEndPlaceholderVisible() ? ('time-field.select-end-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n @if (selectedStartTime() && item.value === selectedStartTime()!) {\n <span class=\"unavailable-indicator\"> ({{ 'time-field.unavailable' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- End Time Individual Error Messages -->\n @if (hasEndTimeError()) {\n <core-field-errors [errors]=\"endTimeErrors()\"></core-field-errors>\n }\n </div>\n }\n\n <!-- General Error Messages (only if not using individual validation) -->\n @if (!includeEndTime() && hasError()) {\n <core-field-errors [errors]=\"errors()\"></core-field-errors>\n }\n</div>\n", styles: [".ng-select .ng-select-container .ng-value-container{flex-wrap:wrap}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{color:var(--_entry-input-placeholder-color);opacity:1}.c-entry-input--ng-select.is-placeholder ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input{color:var(--_entry-input-placeholder-color)}.c-entry-input--ng-select:not(.is-placeholder) ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input input::placeholder{opacity:0}::ng-deep .ng-select{width:100%!important;display:contents}.c-entry-input--ng-select{position:relative}::ng-deep .ng-dropdown-panel{top:0;right:0}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value{background-color:var(--form-highlighted-color, var(--color-neutral-300));color:#3f4e6a;border-radius:var(--_entry-input-br);padding:.2em .8em;margin:.2em;border:none;border-radius:4px}::ng-deep .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{border:none;padding-right:.4em;color:#3f4e6a}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items{border:none;min-height:auto;padding:0;position:relative;right:0;margin-top:3em;box-shadow:1em 2.4em 3.4em -2em hsl(var(--color-neutral-900-hsl)/25%);background-color:var(--color-neutral-100)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{padding:.6em .8em;color:#6a788c;cursor:pointer;transition:background-color .1s ease-out}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{color:var(--color-primary-400)}::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:var(--color-primary-400);font-weight:500}::ng-deep .ng-dropdown-panel .scrollable-content{background:#f2f5fa}::ng-deep .ng-dropdown-panel-items.scroll-host{background:#f2f5fa;padding:1em;border-radius:var(--_entry-input-br)}::ng-deep app-server-select-field .ng-select:not(.ng-select-filtered):not(.ng-select-opened) .ng-dropdown-panel{opacity:0!important}::ng-deep .c-entry-input--ng-select{--_entry-input-padd-y: .76em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value){--_entry-input-padd-y: .35em}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input{margin-left:8px}::ng-deep .c-entry-input--ng-select:has(.ng-value-container .ng-value) .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-notfound){background-color:hsl(from hsl(var(--color-context-error-hsl)) h s 94%);color:hsl(from hsl(var(--color-context-error-hsl)) h s 60%)}::ng-deep .ng-dropdown-panel-items.scroll-host:has(.ng-select-loading){background-color:hsl(from hsl(var(--color-alternative-800-hsl)) h s 96%);color:hsl(from hsl(var(--color-alternative-800-hsl)) h 90% 70%)}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container{display:grid;justify-content:start}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{height:-webkit-fill-available}::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{height:98%}::ng-deep .ng-select.ng-select-single .ng-select-container{overflow:visible;position:relative;cursor:pointer}::ng-deep .ng-select.ng-select-single .ng-select-container:before{content:\"\";position:absolute;left:calc(var(--_entry-input-padd-x) * -1);right:calc(var(--_entry-input-padd-x) * -1 - var(--_entry-input-addon-gap) - var(--_entry-input-addon-icon-fz));top:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1);bottom:calc(max(var(--_entry-input-padd-y) * var(--_size-factor, 1),2px)*-1)}::ng-deep .ng-select .ng-clear-wrapper .ng-clear{position:absolute;top:50%;transform:translateY(-50%)}@media (hover: hover){::ng-deep .ng-select .ng-clear-wrapper:is(:hover,:focus-visible){color:var(--color-hover)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
5027
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: TimeFieldComponent, isStandalone: true, selector: "core-time-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, rowData: { classPropertyName: "rowData", publicName: "rowData", isSignal: true, isRequired: false, transformFunction: null }, formValue: { classPropertyName: "formValue", publicName: "formValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", onBlurEvent: "onBlurEvent", onEnterEvent: "onEnterEvent" }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\" [class.time-field-range]=\"includeEndTime()\">\n <!-- Start Time Field -->\n <div class=\"time-field-container\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-start'\">\n {{ startTimeLabel() | translate }}\n @if (includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"includeEndTime() ? hasStartTimeError() : hasError()\">\n <ng-select\n [id]=\"field().key.toString() + '-start'\"\n [items]=\"startTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!(includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators())\"\n [disabled]=\"isDisabled()\"\n [ngModel]=\"selectedStartTime()\"\n (ngModelChange)=\"onStartTimeChange($event)\"\n (blur)=\"onStartTimeBlur()\"\n [placeholder]=\"isStartPlaceholderVisible() ? ('time-field.select-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- Start Time Individual Error Messages -->\n @if (includeEndTime() && hasStartTimeError()) {\n <core-field-errors [errors]=\"startTimeErrors()\"></core-field-errors>\n }\n </div>\n\n <!-- End Time Field (only if includeEndTime is true) -->\n @if (includeEndTime()) {\n <div class=\"time-field-container time-field-end\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-end'\">\n {{ endTimeLabel() | translate }}\n @if (hasEndTimeRequiredValidator()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasEndTimeError()\">\n <ng-select\n [id]=\"field().key.toString() + '-end'\"\n [items]=\"endTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!hasEndTimeRequiredValidator()\"\n [disabled]=\"isDisabled() || !selectedStartTime()\"\n [ngModel]=\"selectedEndTime()\"\n (ngModelChange)=\"onEndTimeChange($event)\"\n (blur)=\"onEndTimeBlur()\"\n [placeholder]=\"isEndPlaceholderVisible() ? ('time-field.select-end-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n @if (selectedStartTime() && item.value === selectedStartTime()!) {\n <span class=\"unavailable-indicator\"> ({{ 'time-field.unavailable' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- End Time Individual Error Messages -->\n @if (hasEndTimeError()) {\n <core-field-errors [errors]=\"endTimeErrors()\"></core-field-errors>\n }\n </div>\n }\n\n <!-- General Error Messages (only if not using individual validation) -->\n @if (!includeEndTime() && hasError()) {\n <core-field-errors [errors]=\"errors()\"></core-field-errors>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
|
|
5028
5028
|
}
|
|
5029
5029
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: TimeFieldComponent, decorators: [{
|
|
5030
5030
|
type: Component,
|
|
5031
|
-
args: [{ selector: 'core-time-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\" [class.time-field-range]=\"includeEndTime()\">\n <!-- Start Time Field -->\n <div class=\"time-field-container\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-start'\">\n {{ startTimeLabel() | translate }}\n @if (includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"includeEndTime() ? hasStartTimeError() : hasError()\">\n <ng-select\n [id]=\"field().key.toString() + '-start'\"\n [items]=\"startTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!(includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators())\"\n [disabled]=\"isDisabled()\"\n [ngModel]=\"selectedStartTime()\"\n (ngModelChange)=\"onStartTimeChange($event)\"\n (blur)=\"onStartTimeBlur()\"\n [placeholder]=\"isStartPlaceholderVisible() ? ('time-field.select-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- Start Time Individual Error Messages -->\n @if (includeEndTime() && hasStartTimeError()) {\n <core-field-errors [errors]=\"startTimeErrors()\"></core-field-errors>\n }\n </div>\n\n <!-- End Time Field (only if includeEndTime is true) -->\n @if (includeEndTime()) {\n <div class=\"time-field-container time-field-end\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-end'\">\n {{ endTimeLabel() | translate }}\n @if (hasEndTimeRequiredValidator()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasEndTimeError()\">\n <ng-select\n [id]=\"field().key.toString() + '-end'\"\n [items]=\"endTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!hasEndTimeRequiredValidator()\"\n [disabled]=\"isDisabled() || !selectedStartTime()\"\n [ngModel]=\"selectedEndTime()\"\n (ngModelChange)=\"onEndTimeChange($event)\"\n (blur)=\"onEndTimeBlur()\"\n [placeholder]=\"isEndPlaceholderVisible() ? ('time-field.select-end-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n @if (selectedStartTime() && item.value === selectedStartTime()!) {\n <span class=\"unavailable-indicator\"> ({{ 'time-field.unavailable' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- End Time Individual Error Messages -->\n @if (hasEndTimeError()) {\n <core-field-errors [errors]=\"endTimeErrors()\"></core-field-errors>\n }\n </div>\n }\n\n <!-- General Error Messages (only if not using individual validation) -->\n @if (!includeEndTime() && hasError()) {\n <core-field-errors [errors]=\"errors()\"></core-field-errors>\n }\n</div>\n"
|
|
5031
|
+
args: [{ selector: 'core-time-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, NgSelectModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<div class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\" [class.time-field-range]=\"includeEndTime()\">\n <!-- Start Time Field -->\n <div class=\"time-field-container\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-start'\">\n {{ startTimeLabel() | translate }}\n @if (includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"includeEndTime() ? hasStartTimeError() : hasError()\">\n <ng-select\n [id]=\"field().key.toString() + '-start'\"\n [items]=\"startTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!(includeEndTime() ? hasStartTimeRequiredValidator() : hasRequiredValidators())\"\n [disabled]=\"isDisabled()\"\n [ngModel]=\"selectedStartTime()\"\n (ngModelChange)=\"onStartTimeChange($event)\"\n (blur)=\"onStartTimeBlur()\"\n [placeholder]=\"isStartPlaceholderVisible() ? ('time-field.select-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- Start Time Individual Error Messages -->\n @if (includeEndTime() && hasStartTimeError()) {\n <core-field-errors [errors]=\"startTimeErrors()\"></core-field-errors>\n }\n </div>\n\n <!-- End Time Field (only if includeEndTime is true) -->\n @if (includeEndTime()) {\n <div class=\"time-field-container time-field-end\">\n <label class=\"c-entry-text\" [for]=\"field().key.toString() + '-end'\">\n {{ endTimeLabel() | translate }}\n @if (hasEndTimeRequiredValidator()) {\n <span class=\"c-required\">*</span>\n }\n </label>\n \n <span class=\"c-entry-input c-entry-input--ng-select\" [class.is-invalid]=\"hasEndTimeError()\">\n <ng-select\n [id]=\"field().key.toString() + '-end'\"\n [items]=\"endTimeOptions()\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [clearable]=\"!hasEndTimeRequiredValidator()\"\n [disabled]=\"isDisabled() || !selectedStartTime()\"\n [ngModel]=\"selectedEndTime()\"\n (ngModelChange)=\"onEndTimeChange($event)\"\n (blur)=\"onEndTimeBlur()\"\n [placeholder]=\"isEndPlaceholderVisible() ? ('time-field.select-end-time' | translate) : ''\"\n [searchable]=\"false\">\n \n <ng-template ng-option-tmp let-item=\"item\">\n {{ item.label }}\n @if (item.used) {\n <span class=\"used-indicator\"> ({{ 'time-field.used' | translate }})</span>\n }\n @if (selectedStartTime() && item.value === selectedStartTime()!) {\n <span class=\"unavailable-indicator\"> ({{ 'time-field.unavailable' | translate }})</span>\n }\n </ng-template>\n <ng-template ng-label-tmp let-item=\"item\">\n {{ item.label }}\n </ng-template>\n </ng-select>\n <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n </span>\n \n <!-- End Time Individual Error Messages -->\n @if (hasEndTimeError()) {\n <core-field-errors [errors]=\"endTimeErrors()\"></core-field-errors>\n }\n </div>\n }\n\n <!-- General Error Messages (only if not using individual validation) -->\n @if (!includeEndTime() && hasError()) {\n <core-field-errors [errors]=\"errors()\"></core-field-errors>\n }\n</div>\n" }]
|
|
5032
5032
|
}], ctorParameters: () => [] });
|
|
5033
5033
|
|
|
5034
5034
|
class DynamicFieldDirective {
|
|
@@ -10066,11 +10066,11 @@ class GenericPaginationComponent {
|
|
|
10066
10066
|
return pages;
|
|
10067
10067
|
}
|
|
10068
10068
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericPaginationComponent, deps: [{ token: PaginationService }, { token: TableDataService }], target: i0.ɵɵFactoryTarget.Component });
|
|
10069
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericPaginationComponent, isStandalone: true, selector: "core-generic-pagination", inputs: { tableId: { classPropertyName: "tableId", publicName: "tableId", isSignal: true, isRequired: false, transformFunction: null }, isServerSide: { classPropertyName: "isServerSide", publicName: "isServerSide", isSignal: true, isRequired: false, transformFunction: null }, showPagination: { classPropertyName: "showPagination", publicName: "showPagination", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelector: { classPropertyName: "showPageSizeSelector", publicName: "showPageSizeSelector", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (getTotalItems() > 0) {\n <div class=\"c-pagination\">\n <p class=\"c-pagination__summary\">\n {{ 'pagination.viewing' | translate }} \n <span>{{ getDisplayedRange().start }}-{{ getDisplayedRange().end }}</span> \n {{ 'pagination.of' | translate }} \n <span>{{ getTotalItems() }}</span>\n </p>\n \n @if (showPageSizeSelector()) {\n <div class=\"c-pagination__select\">\n <label for=\"page-size-{{ tableId }}\" class=\"c-pagination__summary\">\n {{ 'pagination.itemsPerPage' | translate }}:\n </label>\n <div class=\"c-pagination__select-holder\">\n <select \n id=\"page-size-{{ tableId }}\"\n class=\"c-input \"\n [value]=\"getPageSize()\"\n (change)=\"handlePageSizeChange($event)\">\n @for (option of getPageSizeOptions(); track option) {\n <option [value]=\"option\">{{ option }}</option>\n }\n </select>\n </div>\n </div>\n }\n\n @if (showPagination()) {\n <nav class=\"c-pager\">\n <ul class=\"c-pager__list\">\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === 1\" \n (click)=\"onPageChange(getCurrentPage() - 1)\">\n <span class=\"icon-arrow-left\"></span>\n </a>\n </li>\n\n <ng-container *ngFor=\"let page of getVisiblePages()\">\n <li class=\"c-pager__item\">\n @if (page === '...') {\n <span class=\"c-pager__link\">...</span>\n } @else {\n <a class=\"c-pager__link\" \n [class.is-active]=\"getCurrentPage() === page\"\n (click)=\"onPageChange(+page)\">\n {{ page }}\n </a>\n }\n </li>\n </ng-container>\n\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === getTotalPages()\"\n (click)=\"onPageChange(getCurrentPage() + 1)\">\n <span class=\"icon-arrow-right\"></span>\n </a>\n </li>\n </ul>\n </nav>\n }\n </div>\n}", styles: ["
|
|
10069
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericPaginationComponent, isStandalone: true, selector: "core-generic-pagination", inputs: { tableId: { classPropertyName: "tableId", publicName: "tableId", isSignal: true, isRequired: false, transformFunction: null }, isServerSide: { classPropertyName: "isServerSide", publicName: "isServerSide", isSignal: true, isRequired: false, transformFunction: null }, showPagination: { classPropertyName: "showPagination", publicName: "showPagination", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelector: { classPropertyName: "showPageSizeSelector", publicName: "showPageSizeSelector", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (getTotalItems() > 0) {\n <div class=\"c-pagination\">\n <p class=\"c-pagination__summary\">\n {{ 'pagination.viewing' | translate }} \n <span>{{ getDisplayedRange().start }}-{{ getDisplayedRange().end }}</span> \n {{ 'pagination.of' | translate }} \n <span>{{ getTotalItems() }}</span>\n </p>\n \n @if (showPageSizeSelector()) {\n <div class=\"c-pagination__select\">\n <label for=\"page-size-{{ tableId }}\" class=\"c-pagination__summary\">\n {{ 'pagination.itemsPerPage' | translate }}:\n </label>\n <div class=\"c-pagination__select-holder\">\n <select \n id=\"page-size-{{ tableId }}\"\n class=\"c-input \"\n [value]=\"getPageSize()\"\n (change)=\"handlePageSizeChange($event)\">\n @for (option of getPageSizeOptions(); track option) {\n <option [value]=\"option\">{{ option }}</option>\n }\n </select>\n </div>\n </div>\n }\n\n @if (showPagination()) {\n <nav class=\"c-pager\">\n <ul class=\"c-pager__list\">\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === 1\" \n (click)=\"onPageChange(getCurrentPage() - 1)\">\n <span class=\"icon-arrow-left\"></span>\n </a>\n </li>\n\n <ng-container *ngFor=\"let page of getVisiblePages()\">\n <li class=\"c-pager__item\">\n @if (page === '...') {\n <span class=\"c-pager__link\">...</span>\n } @else {\n <a class=\"c-pager__link\" \n [class.is-active]=\"getCurrentPage() === page\"\n (click)=\"onPageChange(+page)\">\n {{ page }}\n </a>\n }\n </li>\n </ng-container>\n\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === getTotalPages()\"\n (click)=\"onPageChange(getCurrentPage() + 1)\">\n <span class=\"icon-arrow-right\"></span>\n </a>\n </li>\n </ul>\n </nav>\n }\n </div>\n}", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
10070
10070
|
}
|
|
10071
10071
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericPaginationComponent, decorators: [{
|
|
10072
10072
|
type: Component,
|
|
10073
|
-
args: [{ selector: 'core-generic-pagination', standalone: true, imports: [CommonModule, TranslateModule], hostDirectives: [CoreHostDirective], template: "@if (getTotalItems() > 0) {\n <div class=\"c-pagination\">\n <p class=\"c-pagination__summary\">\n {{ 'pagination.viewing' | translate }} \n <span>{{ getDisplayedRange().start }}-{{ getDisplayedRange().end }}</span> \n {{ 'pagination.of' | translate }} \n <span>{{ getTotalItems() }}</span>\n </p>\n \n @if (showPageSizeSelector()) {\n <div class=\"c-pagination__select\">\n <label for=\"page-size-{{ tableId }}\" class=\"c-pagination__summary\">\n {{ 'pagination.itemsPerPage' | translate }}:\n </label>\n <div class=\"c-pagination__select-holder\">\n <select \n id=\"page-size-{{ tableId }}\"\n class=\"c-input \"\n [value]=\"getPageSize()\"\n (change)=\"handlePageSizeChange($event)\">\n @for (option of getPageSizeOptions(); track option) {\n <option [value]=\"option\">{{ option }}</option>\n }\n </select>\n </div>\n </div>\n }\n\n @if (showPagination()) {\n <nav class=\"c-pager\">\n <ul class=\"c-pager__list\">\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === 1\" \n (click)=\"onPageChange(getCurrentPage() - 1)\">\n <span class=\"icon-arrow-left\"></span>\n </a>\n </li>\n\n <ng-container *ngFor=\"let page of getVisiblePages()\">\n <li class=\"c-pager__item\">\n @if (page === '...') {\n <span class=\"c-pager__link\">...</span>\n } @else {\n <a class=\"c-pager__link\" \n [class.is-active]=\"getCurrentPage() === page\"\n (click)=\"onPageChange(+page)\">\n {{ page }}\n </a>\n }\n </li>\n </ng-container>\n\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === getTotalPages()\"\n (click)=\"onPageChange(getCurrentPage() + 1)\">\n <span class=\"icon-arrow-right\"></span>\n </a>\n </li>\n </ul>\n </nav>\n }\n </div>\n}"
|
|
10073
|
+
args: [{ selector: 'core-generic-pagination', standalone: true, imports: [CommonModule, TranslateModule], hostDirectives: [CoreHostDirective], template: "@if (getTotalItems() > 0) {\n <div class=\"c-pagination\">\n <p class=\"c-pagination__summary\">\n {{ 'pagination.viewing' | translate }} \n <span>{{ getDisplayedRange().start }}-{{ getDisplayedRange().end }}</span> \n {{ 'pagination.of' | translate }} \n <span>{{ getTotalItems() }}</span>\n </p>\n \n @if (showPageSizeSelector()) {\n <div class=\"c-pagination__select\">\n <label for=\"page-size-{{ tableId }}\" class=\"c-pagination__summary\">\n {{ 'pagination.itemsPerPage' | translate }}:\n </label>\n <div class=\"c-pagination__select-holder\">\n <select \n id=\"page-size-{{ tableId }}\"\n class=\"c-input \"\n [value]=\"getPageSize()\"\n (change)=\"handlePageSizeChange($event)\">\n @for (option of getPageSizeOptions(); track option) {\n <option [value]=\"option\">{{ option }}</option>\n }\n </select>\n </div>\n </div>\n }\n\n @if (showPagination()) {\n <nav class=\"c-pager\">\n <ul class=\"c-pager__list\">\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === 1\" \n (click)=\"onPageChange(getCurrentPage() - 1)\">\n <span class=\"icon-arrow-left\"></span>\n </a>\n </li>\n\n <ng-container *ngFor=\"let page of getVisiblePages()\">\n <li class=\"c-pager__item\">\n @if (page === '...') {\n <span class=\"c-pager__link\">...</span>\n } @else {\n <a class=\"c-pager__link\" \n [class.is-active]=\"getCurrentPage() === page\"\n (click)=\"onPageChange(+page)\">\n {{ page }}\n </a>\n }\n </li>\n </ng-container>\n\n <li class=\"c-pager__item\">\n <a class=\"c-pager__link\" \n [class.disabled]=\"getCurrentPage() === getTotalPages()\"\n (click)=\"onPageChange(getCurrentPage() + 1)\">\n <span class=\"icon-arrow-right\"></span>\n </a>\n </li>\n </ul>\n </nav>\n }\n </div>\n}" }]
|
|
10074
10074
|
}], ctorParameters: () => [{ type: PaginationService }, { type: TableDataService }] });
|
|
10075
10075
|
|
|
10076
10076
|
class ConfirmationDialogComponent {
|
|
@@ -16648,12 +16648,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
16648
16648
|
// Este archivo es generado automáticamente por scripts/update-version.js
|
|
16649
16649
|
// No edites manualmente este archivo
|
|
16650
16650
|
const VERSION = {
|
|
16651
|
-
full: '2.17.
|
|
16651
|
+
full: '2.17.5',
|
|
16652
16652
|
major: 2,
|
|
16653
16653
|
minor: 17,
|
|
16654
|
-
patch:
|
|
16655
|
-
timestamp: '2025-12-
|
|
16656
|
-
buildDate: '
|
|
16654
|
+
patch: 5,
|
|
16655
|
+
timestamp: '2025-12-18T14:30:17.000Z',
|
|
16656
|
+
buildDate: '18/12/2025'
|
|
16657
16657
|
};
|
|
16658
16658
|
|
|
16659
16659
|
class MainNavComponent {
|