ui-core-abv 0.6.1 → 0.6.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/fesm2022/ui-core-abv.mjs
CHANGED
|
@@ -297,6 +297,15 @@ const DICTIONARY_EN = {
|
|
|
297
297
|
browser_incompatibility_message: 'This browser does not support this feature.',
|
|
298
298
|
voice_error: 'Error while starting voice dictation',
|
|
299
299
|
},
|
|
300
|
+
validation: {
|
|
301
|
+
invalid: '{{field}} is invalid.',
|
|
302
|
+
required: '{{field}} is required.',
|
|
303
|
+
min: '{{field}} must be greater than or equal to {{min}}.',
|
|
304
|
+
max: '{{field}} must be less than or equal to {{max}}.',
|
|
305
|
+
minlength: '{{field}} must have at least {{requiredLength}} characters.',
|
|
306
|
+
maxlength: '{{field}} cannot exceed {{requiredLength}} characters.',
|
|
307
|
+
pattern: '{{field}} has an invalid format.',
|
|
308
|
+
},
|
|
300
309
|
clipboard: {
|
|
301
310
|
copy_error: 'Could not copy:',
|
|
302
311
|
},
|
|
@@ -394,6 +403,15 @@ const DICTIONARY_ES = {
|
|
|
394
403
|
browser_incompatibility_message: 'Este navegador no sorporta esta caracteristica.',
|
|
395
404
|
voice_error: 'Error al intentar dictado por voz',
|
|
396
405
|
},
|
|
406
|
+
validation: {
|
|
407
|
+
invalid: '{{field}} es invalido.',
|
|
408
|
+
required: '{{field}} es obligatorio.',
|
|
409
|
+
min: '{{field}} debe ser mayor o igual a {{min}}.',
|
|
410
|
+
max: '{{field}} debe ser menor o igual a {{max}}.',
|
|
411
|
+
minlength: '{{field}} debe tener al menos {{requiredLength}} caracteres.',
|
|
412
|
+
maxlength: '{{field}} no puede superar {{requiredLength}} caracteres.',
|
|
413
|
+
pattern: '{{field}} no tiene el formato correcto.',
|
|
414
|
+
},
|
|
397
415
|
clipboard: {
|
|
398
416
|
copy_error: 'No se pudo copiar:',
|
|
399
417
|
},
|
|
@@ -3052,19 +3070,35 @@ class UicDynamicFormComponent {
|
|
|
3052
3070
|
return Object.keys(control.errors).map(errorKey => {
|
|
3053
3071
|
const error = control.errors?.[errorKey];
|
|
3054
3072
|
const mapper = this.errorMessages[errorKey];
|
|
3055
|
-
return mapper
|
|
3073
|
+
return mapper
|
|
3074
|
+
? mapper(error, field)
|
|
3075
|
+
: this.i18n.translate('validation.invalid', {
|
|
3076
|
+
field: field.label ?? field.name,
|
|
3077
|
+
});
|
|
3056
3078
|
});
|
|
3057
3079
|
}
|
|
3058
3080
|
isListening(fieldName) {
|
|
3059
3081
|
return this.listeningField === fieldName;
|
|
3060
3082
|
}
|
|
3061
3083
|
errorMessages = {
|
|
3062
|
-
required: (_err, field) =>
|
|
3063
|
-
min: (err, field) =>
|
|
3064
|
-
|
|
3065
|
-
|
|
3066
|
-
|
|
3067
|
-
|
|
3084
|
+
required: (_err, field) => this.i18n.translate('validation.required', { field: field.label ?? field.name }),
|
|
3085
|
+
min: (err, field) => this.i18n.translate('validation.min', {
|
|
3086
|
+
field: field.label ?? field.name,
|
|
3087
|
+
min: err.min,
|
|
3088
|
+
}),
|
|
3089
|
+
max: (err, field) => this.i18n.translate('validation.max', {
|
|
3090
|
+
field: field.label ?? field.name,
|
|
3091
|
+
max: err.max,
|
|
3092
|
+
}),
|
|
3093
|
+
minlength: (err, field) => this.i18n.translate('validation.minlength', {
|
|
3094
|
+
field: field.label ?? field.name,
|
|
3095
|
+
requiredLength: err.requiredLength,
|
|
3096
|
+
}),
|
|
3097
|
+
maxlength: (err, field) => this.i18n.translate('validation.maxlength', {
|
|
3098
|
+
field: field.label ?? field.name,
|
|
3099
|
+
requiredLength: err.requiredLength,
|
|
3100
|
+
}),
|
|
3101
|
+
pattern: (_err, field) => this.i18n.translate('validation.pattern', { field: field.label ?? field.name })
|
|
3068
3102
|
};
|
|
3069
3103
|
getInputColor(field, value) {
|
|
3070
3104
|
const scale = field.internalColorScale;
|
|
@@ -3882,7 +3916,7 @@ class UicDropdownContainerComponent {
|
|
|
3882
3916
|
provide: DROPDOWN_OVERLAY_CONTROLS,
|
|
3883
3917
|
useExisting: forwardRef(() => UicDropdownContainerComponent),
|
|
3884
3918
|
},
|
|
3885
|
-
], queries: [{ propertyName: "projectedTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], ngImport: i0, template: "\n<div #triggerButton class=\"triggerButton\" (click)=\"onTriggerClick($event)\">\n <ng-content select=\"[button]\"></ng-content>\n</div>\n\n<ng-template #contentTemplate >\n <div class=\"ui-dropdown-panel\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</ng-template>", styles: [":host{display:inline-block}.triggerButton{width:fit-content;height:fit-content}.ui-dropdown-panel{border-radius:var(--input-radius);background-color:var(--white);box-shadow:0 1px 1px #00000020,0 2px 5px #00000050;width:100%;top:100%;max-height:50vh;font-size:.875rem;z-index:500;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
3919
|
+
], queries: [{ propertyName: "projectedTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], ngImport: i0, template: "\r\n<div #triggerButton class=\"triggerButton\" (click)=\"onTriggerClick($event)\">\r\n <ng-content select=\"[button]\"></ng-content>\r\n</div>\r\n\r\n<ng-template #contentTemplate >\r\n <div class=\"ui-dropdown-panel\">\r\n <ng-content select=\"[content]\"></ng-content>\r\n </div>\r\n</ng-template>", styles: [":host{display:inline-block}.triggerButton{width:fit-content;height:fit-content}.ui-dropdown-panel{border-radius:var(--input-radius);background-color:var(--white);box-shadow:0 1px 1px #00000020,0 2px 5px #00000050;width:100%;top:100%;max-height:50vh;font-size:.875rem;z-index:500;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
3886
3920
|
}
|
|
3887
3921
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicDropdownContainerComponent, decorators: [{
|
|
3888
3922
|
type: Component,
|
|
@@ -3891,7 +3925,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
3891
3925
|
provide: DROPDOWN_OVERLAY_CONTROLS,
|
|
3892
3926
|
useExisting: forwardRef(() => UicDropdownContainerComponent),
|
|
3893
3927
|
},
|
|
3894
|
-
], template: "\n<div #triggerButton class=\"triggerButton\" (click)=\"onTriggerClick($event)\">\n <ng-content select=\"[button]\"></ng-content>\n</div>\n\n<ng-template #contentTemplate >\n <div class=\"ui-dropdown-panel\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</ng-template>", styles: [":host{display:inline-block}.triggerButton{width:fit-content;height:fit-content}.ui-dropdown-panel{border-radius:var(--input-radius);background-color:var(--white);box-shadow:0 1px 1px #00000020,0 2px 5px #00000050;width:100%;top:100%;max-height:50vh;font-size:.875rem;z-index:500;overflow:auto}\n"] }]
|
|
3928
|
+
], template: "\r\n<div #triggerButton class=\"triggerButton\" (click)=\"onTriggerClick($event)\">\r\n <ng-content select=\"[button]\"></ng-content>\r\n</div>\r\n\r\n<ng-template #contentTemplate >\r\n <div class=\"ui-dropdown-panel\">\r\n <ng-content select=\"[content]\"></ng-content>\r\n </div>\r\n</ng-template>", styles: [":host{display:inline-block}.triggerButton{width:fit-content;height:fit-content}.ui-dropdown-panel{border-radius:var(--input-radius);background-color:var(--white);box-shadow:0 1px 1px #00000020,0 2px 5px #00000050;width:100%;top:100%;max-height:50vh;font-size:.875rem;z-index:500;overflow:auto}\n"] }]
|
|
3895
3929
|
}], propDecorators: { buttonLabel: [{
|
|
3896
3930
|
type: Input
|
|
3897
3931
|
}], disabled: [{
|
|
@@ -4477,11 +4511,11 @@ class UicModalComponent {
|
|
|
4477
4511
|
this.modalRef.closeFloating(null);
|
|
4478
4512
|
}
|
|
4479
4513
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicModalComponent, deps: [{ token: UiModalRef }, { token: MODAL_COMPONENT }, { token: MODAL_CONFIG }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
4480
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UicModalComponent, isStandalone: true, selector: "ui-modal", viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], ngImport: i0, template: "<div class=\"uic_backdrop\" (click)=\"closeOuside()\"> \n <div @pushTop class=\"uic_modal\" \n [class]=\"myConfig.size ? 'uic_' + myConfig.size : ''\"\n (click)=\"$event.stopPropagation()\">\n \n @if ( myConfig.title) {\n <div class=\"uic_modal-header\">\n {{myConfig.title}}\n <ui-button color=\"red\" type=\"ghost\" icon=\"ri-close-large-line\" (click)=\"close()\" [iconOnly]=\"true\"></ui-button>\n </div>\n }\n <div class=\"uic_modal-body\" [class.uic_body-padding]=\"myConfig.title!='' && !myConfig.noPadding\">\n <ng-template cdkPortalOutlet></ng-template>\n </div>\n\n </div>\n</div>\n", styles: [".uic_backdrop{position:fixed;width:100%;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center}@media (max-width: 479px){.uic_backdrop{align-items:flex-start;padding-top:20px}}.uic_modal{background:var(--white);border-radius:20px;min-width:300px;max-width:90%;height:fit-content;max-height:90vh;box-shadow:0 20px 70px #00000052;overflow:hidden;display:flex;flex-direction:column}.uic_modal-header{padding:0 15px;width:100%;display:flex;align-items:center;font-size:22px;font-weight:600;justify-content:space-between;margin:0 auto;color:var(--primary-500);height:63px;border-bottom:solid 1px var(--primary-500)}@media (max-width: 479px){.uic_modal-header{padding:5px}}.uic_modal-body{flex:1 1;overflow-y:auto}.uic_body-padding{padding:25px}@media (max-width: 479px){.uic_body-padding{padding:10px}}.uic_medium{width:70%;max-width:800px;max-height:80%}@media (max-width: 479px){.uic_medium{width:90%}}.uic_large{width:80%;max-width:900px}@media (max-width: 479px){.uic_large{width:95%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: UicButtonComponent, selector: "ui-button", inputs: ["text", "icon", "rightIcon", "iconOnly", "disabled", "loading", "size", "type", "color"] }], animations: [pushTop] });
|
|
4514
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UicModalComponent, isStandalone: true, selector: "ui-modal", viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], ngImport: i0, template: "<div class=\"uic_backdrop\" (click)=\"closeOuside()\"> \r\n <div @pushTop class=\"uic_modal\" \r\n [class]=\"myConfig.size ? 'uic_' + myConfig.size : ''\"\r\n (click)=\"$event.stopPropagation()\">\r\n \r\n @if ( myConfig.title) {\r\n <div class=\"uic_modal-header\">\r\n {{myConfig.title}}\r\n <ui-button color=\"red\" type=\"ghost\" icon=\"ri-close-large-line\" (click)=\"close()\" [iconOnly]=\"true\"></ui-button>\r\n </div>\r\n }\r\n <div class=\"uic_modal-body\" [class.uic_body-padding]=\"myConfig.title!='' && !myConfig.noPadding\">\r\n <ng-template cdkPortalOutlet></ng-template>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n", styles: [".uic_backdrop{position:fixed;width:100%;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center}@media (max-width: 479px){.uic_backdrop{align-items:flex-start;padding-top:20px}}.uic_modal{background:var(--white);border-radius:20px;min-width:300px;max-width:90%;height:fit-content;max-height:90vh;box-shadow:0 20px 70px #00000052;overflow:hidden;display:flex;flex-direction:column}.uic_modal-header{padding:0 15px;width:100%;display:flex;align-items:center;font-size:22px;font-weight:600;justify-content:space-between;margin:0 auto;color:var(--primary-500);height:63px;border-bottom:solid 1px var(--primary-500)}@media (max-width: 479px){.uic_modal-header{padding:5px}}.uic_modal-body{flex:1 1;overflow-y:auto}.uic_body-padding{padding:25px}@media (max-width: 479px){.uic_body-padding{padding:10px}}.uic_medium{width:70%;max-width:800px;max-height:80%}@media (max-width: 479px){.uic_medium{width:90%}}.uic_large{width:80%;max-width:900px}@media (max-width: 479px){.uic_large{width:95%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: UicButtonComponent, selector: "ui-button", inputs: ["text", "icon", "rightIcon", "iconOnly", "disabled", "loading", "size", "type", "color"] }], animations: [pushTop] });
|
|
4481
4515
|
}
|
|
4482
4516
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicModalComponent, decorators: [{
|
|
4483
4517
|
type: Component,
|
|
4484
|
-
args: [{ selector: 'ui-modal', imports: [CommonModule, PortalModule, UicButtonComponent], animations: [pushTop], template: "<div class=\"uic_backdrop\" (click)=\"closeOuside()\"> \n <div @pushTop class=\"uic_modal\" \n [class]=\"myConfig.size ? 'uic_' + myConfig.size : ''\"\n (click)=\"$event.stopPropagation()\">\n \n @if ( myConfig.title) {\n <div class=\"uic_modal-header\">\n {{myConfig.title}}\n <ui-button color=\"red\" type=\"ghost\" icon=\"ri-close-large-line\" (click)=\"close()\" [iconOnly]=\"true\"></ui-button>\n </div>\n }\n <div class=\"uic_modal-body\" [class.uic_body-padding]=\"myConfig.title!='' && !myConfig.noPadding\">\n <ng-template cdkPortalOutlet></ng-template>\n </div>\n\n </div>\n</div>\n", styles: [".uic_backdrop{position:fixed;width:100%;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center}@media (max-width: 479px){.uic_backdrop{align-items:flex-start;padding-top:20px}}.uic_modal{background:var(--white);border-radius:20px;min-width:300px;max-width:90%;height:fit-content;max-height:90vh;box-shadow:0 20px 70px #00000052;overflow:hidden;display:flex;flex-direction:column}.uic_modal-header{padding:0 15px;width:100%;display:flex;align-items:center;font-size:22px;font-weight:600;justify-content:space-between;margin:0 auto;color:var(--primary-500);height:63px;border-bottom:solid 1px var(--primary-500)}@media (max-width: 479px){.uic_modal-header{padding:5px}}.uic_modal-body{flex:1 1;overflow-y:auto}.uic_body-padding{padding:25px}@media (max-width: 479px){.uic_body-padding{padding:10px}}.uic_medium{width:70%;max-width:800px;max-height:80%}@media (max-width: 479px){.uic_medium{width:90%}}.uic_large{width:80%;max-width:900px}@media (max-width: 479px){.uic_large{width:95%}}\n"] }]
|
|
4518
|
+
args: [{ selector: 'ui-modal', imports: [CommonModule, PortalModule, UicButtonComponent], animations: [pushTop], template: "<div class=\"uic_backdrop\" (click)=\"closeOuside()\"> \r\n <div @pushTop class=\"uic_modal\" \r\n [class]=\"myConfig.size ? 'uic_' + myConfig.size : ''\"\r\n (click)=\"$event.stopPropagation()\">\r\n \r\n @if ( myConfig.title) {\r\n <div class=\"uic_modal-header\">\r\n {{myConfig.title}}\r\n <ui-button color=\"red\" type=\"ghost\" icon=\"ri-close-large-line\" (click)=\"close()\" [iconOnly]=\"true\"></ui-button>\r\n </div>\r\n }\r\n <div class=\"uic_modal-body\" [class.uic_body-padding]=\"myConfig.title!='' && !myConfig.noPadding\">\r\n <ng-template cdkPortalOutlet></ng-template>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n", styles: [".uic_backdrop{position:fixed;width:100%;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center}@media (max-width: 479px){.uic_backdrop{align-items:flex-start;padding-top:20px}}.uic_modal{background:var(--white);border-radius:20px;min-width:300px;max-width:90%;height:fit-content;max-height:90vh;box-shadow:0 20px 70px #00000052;overflow:hidden;display:flex;flex-direction:column}.uic_modal-header{padding:0 15px;width:100%;display:flex;align-items:center;font-size:22px;font-weight:600;justify-content:space-between;margin:0 auto;color:var(--primary-500);height:63px;border-bottom:solid 1px var(--primary-500)}@media (max-width: 479px){.uic_modal-header{padding:5px}}.uic_modal-body{flex:1 1;overflow-y:auto}.uic_body-padding{padding:25px}@media (max-width: 479px){.uic_body-padding{padding:10px}}.uic_medium{width:70%;max-width:800px;max-height:80%}@media (max-width: 479px){.uic_medium{width:90%}}.uic_large{width:80%;max-width:900px}@media (max-width: 479px){.uic_large{width:95%}}\n"] }]
|
|
4485
4519
|
}], ctorParameters: () => [{ type: UiModalRef, decorators: [{
|
|
4486
4520
|
type: Inject,
|
|
4487
4521
|
args: [UiModalRef]
|
|
@@ -4821,7 +4855,7 @@ class ItemValueComponent {
|
|
|
4821
4855
|
});
|
|
4822
4856
|
}
|
|
4823
4857
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ItemValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4824
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: ItemValueComponent, isStandalone: true, selector: "ui-item-value", inputs: { key: "key", type: "type", alignment: "alignment", row: "row", disabled: "disabled", data: "data", switchValidation: "switchValidation" }, outputs: { switchConfirmed: "switchConfirmed" }, ngImport: i0, template: "@if (data) {\r\n @if (type == 'text' || !type) {\r\n @if( data.icon ){ <i [class]=\"data.icon + ' ui-trc-' + data.iconColor\"></i>}\r\n
|
|
4858
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: ItemValueComponent, isStandalone: true, selector: "ui-item-value", inputs: { key: "key", type: "type", alignment: "alignment", row: "row", disabled: "disabled", data: "data", switchValidation: "switchValidation" }, outputs: { switchConfirmed: "switchConfirmed" }, ngImport: i0, template: "@if (data) {\r\n @if (type == 'text' || !type) {\r\n <div [class]=\"'ui-trc-' + data.textColor \">\r\n @if( data.icon ){ <i [class]=\"data.icon + ' ui-trc-' + data.iconColor\"></i>}\r\n {{ data.value }} \r\n @if( data.rightIcon ){ <i [class]=\"data.rightIcon + ' ui-trc-' + data.iconColor\"></i>}\r\n </div>\r\n }\r\n @if (type == 'copy') {\r\n <div class=\"copy-div\">\r\n {{ data.value }} \r\n <ui-button (click)=\"copyText((data.value??'').toString(),$event)\" type=\"ghost\" size=\"s\" [iconOnly]=\"true\" icon=\"ri-file-copy-line\"></ui-button>\r\n </div>\r\n }\r\n @if (type == 'money'){\r\n {{ (data.value??0) | currency: data.currencyCode||''}} \r\n }\r\n @if (type == 'bold'){\r\n <b>{{ data.value}}</b>\r\n }\r\n @if (type == 'date'){\r\n {{ (data.value??'').toString() | date: 'dd/MM/yyyy'}} \r\n }\r\n @if (type == 'bigtext') {\r\n <div (click)=\"expand($event)\" class=\"expandible-row\" [class.expandedrow]=\"expanded\">\r\n {{ data.value }} \r\n @if( data.value && data.value.toString().length > 0){\r\n <i [class]=\"expanded?'ri-arrow-up-s-line':'ri-arrow-down-s-line'\"></i>\r\n }\r\n @if (!expanded && data.value && data.value.toString().length > 0) {\r\n <div class=\"fade-overlay\"></div>\r\n }\r\n </div>\r\n }\r\n @if (type == 'icon-list') {\r\n @for (alert of data.list; track $index) {\r\n <i [tip]=\"alert.text\" [class]=\"alert.icon + ' ui-alert'\" ></i>\r\n }\r\n }\r\n @else if (type == 'list'){\r\n <uic-table-list [list]=\"data.list??[]\"></uic-table-list> \r\n }\r\n @else if (type == 'user'){\r\n <uic-table-user [user]=\"data.user\"></uic-table-user> \r\n }\r\n @else if (type == 'status'){\r\n @if (data.value) {\r\n <ui-status-label [icon]=\"data.icon??'ri-circle-fill'\" [color]=\"data.color??''\"> {{data.value}} </ui-status-label> \r\n }@else {\r\n -\r\n }\r\n }\r\n @else if (type == 'tag'){\r\n <ui-status-label type=\"tag\" [icon]=\"data.icon??'ri-circle-fill'\" [color]=\"data.color??''\"> {{data.value}} </ui-status-label> \r\n }\r\n @else if (type == 'switch'){\r\n <div (click)=\"$event.stopPropagation()\">\r\n <ui-switch [disabled]=\"disabled\" [(checked)]=\"checked\" (checkedChange)=\"switchHandler(row.id,$event)\"></ui-switch> \r\n </div>\r\n }\r\n\r\n @if( data.subtext ){\r\n <div [class]=\"'subtext ui-alignment-'+alignment\">{{ data.subtext }}</div>\r\n }\r\n}\r\n\r\n", styles: [".copy-div{display:flex;align-items:center;gap:5px}.expandible-row{display:flex;align-items:flex-start;gap:10px;height:calc(var(--table-spacing-ref) * 4);overflow:hidden;cursor:n-resize;-webkit-user-select:none;user-select:none;position:relative}.expandible-row i{font-size:18px;font-weight:600}.expandible-row:hover>i{color:var(--primary-500)}.fade-overlay{position:absolute;bottom:0;left:0;width:100%;height:10px;pointer-events:none;background:linear-gradient(to top,white 0%,transparent 100%)}.expandedrow{height:fit-content}.subtext{font-size:12px;color:var(--grey-500);font-weight:400;text-align:left}.ui-alignment-center{justify-content:center;text-align:center}b{font-weight:600}.ui-trc-primary{color:var(--primary-500)}.ui-trc-red{color:var(--red-500)}.ui-trc-blue{color:var(--blue-600)}.ui-trc-green{color:var(--green-500)}.ui-trc-yellow{color:var(--yellow-500)}.ui-trc-black{color:var(--grey-900)}.ui-trc-grey{color:var(--grey-300)}\n"], dependencies: [{ kind: "directive", type: UicToolTipDirective, selector: "[tip]", inputs: ["tip"] }, { kind: "component", type: UicTableUserComponent, selector: "uic-table-user", inputs: ["user"] }, { kind: "component", type: UicSwichComponent, selector: "ui-switch", inputs: ["checked", "disabled", "placeholder", "label"], outputs: ["checkedChange"] }, { kind: "component", type: UicStatusLabelComponent, selector: "ui-status-label", inputs: ["color", "type", "icon"] }, { kind: "component", type: UicTableListComponent, selector: "uic-table-list", inputs: ["list"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: UicButtonComponent, selector: "ui-button", inputs: ["text", "icon", "rightIcon", "iconOnly", "disabled", "loading", "size", "type", "color"] }, { kind: "pipe", type: CurrencyPipe, name: "currency" }, { kind: "pipe", type: DatePipe, name: "date" }] });
|
|
4825
4859
|
}
|
|
4826
4860
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ItemValueComponent, decorators: [{
|
|
4827
4861
|
type: Component,
|
|
@@ -4835,7 +4869,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4835
4869
|
UicButtonComponent,
|
|
4836
4870
|
CurrencyPipe,
|
|
4837
4871
|
DatePipe
|
|
4838
|
-
], template: "@if (data) {\r\n @if (type == 'text' || !type) {\r\n @if( data.icon ){ <i [class]=\"data.icon + ' ui-trc-' + data.iconColor\"></i>}\r\n
|
|
4872
|
+
], template: "@if (data) {\r\n @if (type == 'text' || !type) {\r\n <div [class]=\"'ui-trc-' + data.textColor \">\r\n @if( data.icon ){ <i [class]=\"data.icon + ' ui-trc-' + data.iconColor\"></i>}\r\n {{ data.value }} \r\n @if( data.rightIcon ){ <i [class]=\"data.rightIcon + ' ui-trc-' + data.iconColor\"></i>}\r\n </div>\r\n }\r\n @if (type == 'copy') {\r\n <div class=\"copy-div\">\r\n {{ data.value }} \r\n <ui-button (click)=\"copyText((data.value??'').toString(),$event)\" type=\"ghost\" size=\"s\" [iconOnly]=\"true\" icon=\"ri-file-copy-line\"></ui-button>\r\n </div>\r\n }\r\n @if (type == 'money'){\r\n {{ (data.value??0) | currency: data.currencyCode||''}} \r\n }\r\n @if (type == 'bold'){\r\n <b>{{ data.value}}</b>\r\n }\r\n @if (type == 'date'){\r\n {{ (data.value??'').toString() | date: 'dd/MM/yyyy'}} \r\n }\r\n @if (type == 'bigtext') {\r\n <div (click)=\"expand($event)\" class=\"expandible-row\" [class.expandedrow]=\"expanded\">\r\n {{ data.value }} \r\n @if( data.value && data.value.toString().length > 0){\r\n <i [class]=\"expanded?'ri-arrow-up-s-line':'ri-arrow-down-s-line'\"></i>\r\n }\r\n @if (!expanded && data.value && data.value.toString().length > 0) {\r\n <div class=\"fade-overlay\"></div>\r\n }\r\n </div>\r\n }\r\n @if (type == 'icon-list') {\r\n @for (alert of data.list; track $index) {\r\n <i [tip]=\"alert.text\" [class]=\"alert.icon + ' ui-alert'\" ></i>\r\n }\r\n }\r\n @else if (type == 'list'){\r\n <uic-table-list [list]=\"data.list??[]\"></uic-table-list> \r\n }\r\n @else if (type == 'user'){\r\n <uic-table-user [user]=\"data.user\"></uic-table-user> \r\n }\r\n @else if (type == 'status'){\r\n @if (data.value) {\r\n <ui-status-label [icon]=\"data.icon??'ri-circle-fill'\" [color]=\"data.color??''\"> {{data.value}} </ui-status-label> \r\n }@else {\r\n -\r\n }\r\n }\r\n @else if (type == 'tag'){\r\n <ui-status-label type=\"tag\" [icon]=\"data.icon??'ri-circle-fill'\" [color]=\"data.color??''\"> {{data.value}} </ui-status-label> \r\n }\r\n @else if (type == 'switch'){\r\n <div (click)=\"$event.stopPropagation()\">\r\n <ui-switch [disabled]=\"disabled\" [(checked)]=\"checked\" (checkedChange)=\"switchHandler(row.id,$event)\"></ui-switch> \r\n </div>\r\n }\r\n\r\n @if( data.subtext ){\r\n <div [class]=\"'subtext ui-alignment-'+alignment\">{{ data.subtext }}</div>\r\n }\r\n}\r\n\r\n", styles: [".copy-div{display:flex;align-items:center;gap:5px}.expandible-row{display:flex;align-items:flex-start;gap:10px;height:calc(var(--table-spacing-ref) * 4);overflow:hidden;cursor:n-resize;-webkit-user-select:none;user-select:none;position:relative}.expandible-row i{font-size:18px;font-weight:600}.expandible-row:hover>i{color:var(--primary-500)}.fade-overlay{position:absolute;bottom:0;left:0;width:100%;height:10px;pointer-events:none;background:linear-gradient(to top,white 0%,transparent 100%)}.expandedrow{height:fit-content}.subtext{font-size:12px;color:var(--grey-500);font-weight:400;text-align:left}.ui-alignment-center{justify-content:center;text-align:center}b{font-weight:600}.ui-trc-primary{color:var(--primary-500)}.ui-trc-red{color:var(--red-500)}.ui-trc-blue{color:var(--blue-600)}.ui-trc-green{color:var(--green-500)}.ui-trc-yellow{color:var(--yellow-500)}.ui-trc-black{color:var(--grey-900)}.ui-trc-grey{color:var(--grey-300)}\n"] }]
|
|
4839
4873
|
}], propDecorators: { key: [{
|
|
4840
4874
|
type: Input
|
|
4841
4875
|
}], type: [{
|
|
@@ -4862,6 +4896,7 @@ class UicPortletCardComponent {
|
|
|
4862
4896
|
gap = 20;
|
|
4863
4897
|
labelWeight = 400;
|
|
4864
4898
|
valueWeight = 500;
|
|
4899
|
+
valueSize = 14;
|
|
4865
4900
|
switchValidation = [];
|
|
4866
4901
|
finalData = [];
|
|
4867
4902
|
ngOnInit() {
|
|
@@ -4885,13 +4920,13 @@ class UicPortletCardComponent {
|
|
|
4885
4920
|
switchHandler(key, value) {
|
|
4886
4921
|
}
|
|
4887
4922
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicPortletCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4888
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UicPortletCardComponent, isStandalone: true, selector: "ui-portlet-card", inputs: { title: "title", data: "data", layout: "layout", cols: "cols", gap: "gap", labelWeight: "labelWeight", valueWeight: "valueWeight", switchValidation: "switchValidation" }, ngImport: i0, template: "@if ( title) {\r\n <h2>{{title}}</h2>\r\n}\r\n<div class=\"portlet\" \r\n [class.portlet-vertical]=\"layout === 'vertical'\" \r\n [style.gridTemplateColumns]=\"gridTemplateColumns\"\r\n [style]=\"'gap: ' + gap + 'px;'\" >\r\n @for (item of finalData; track $index) {\r\n <div class=\"portlet-row\" [class.portlet-row-vertical]=\"layout === 'vertical'\">\r\n <div class=\"portlet-row-label\" [style.fontWeight]=\"labelWeight\">{{item.label}}:</div>\r\n <div class=\"portlet-row-value\" [style.fontWeight]=\"valueWeight\">\r\n <ui-item-value\r\n [type]=\"item.type??'text'\"\r\n [data]=\"item\"\r\n [switchValidation]=\"switchValidation\"\r\n (switchConfirmed)=\"switchHandler('xx', $event)\"\r\n ></ui-item-value>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".portlet{display:flex;flex-direction:column}.portlet-vertical{display:grid}.portlet-row{display:flex;justify-content:space-between;font-size:.9rem}.portlet-row-vertical{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:4px}.portlet-row-value{display:flex;justify-content:flex-end;text-align:left;gap:5px}.portlet-row-label{color:var(--grey-
|
|
4923
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UicPortletCardComponent, isStandalone: true, selector: "ui-portlet-card", inputs: { title: "title", data: "data", layout: "layout", cols: "cols", gap: "gap", labelWeight: "labelWeight", valueWeight: "valueWeight", valueSize: "valueSize", switchValidation: "switchValidation" }, ngImport: i0, template: "@if ( title) {\r\n <h2>{{title}}</h2>\r\n}\r\n<div class=\"portlet\" \r\n [class.portlet-vertical]=\"layout === 'vertical'\" \r\n [style.gridTemplateColumns]=\"gridTemplateColumns\"\r\n [style]=\"'gap: ' + gap + 'px;'\" >\r\n @for (item of finalData; track $index) {\r\n <div class=\"portlet-row\" [class.portlet-row-vertical]=\"layout === 'vertical'\">\r\n <div class=\"portlet-row-label\" [style.fontWeight]=\"labelWeight\">{{item.label}}:</div>\r\n <div class=\"portlet-row-value\" [style.fontWeight]=\"valueWeight\" [style.fontSize.px]=\"valueSize\">\r\n <ui-item-value\r\n [type]=\"item.type??'text'\"\r\n [data]=\"item\"\r\n [switchValidation]=\"switchValidation\"\r\n (switchConfirmed)=\"switchHandler('xx', $event)\"\r\n ></ui-item-value>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".portlet{display:flex;flex-direction:column}.portlet-vertical{display:grid}.portlet-row{display:flex;justify-content:space-between;font-size:.9rem}.portlet-row-vertical{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:4px}.portlet-row-value{display:flex;justify-content:flex-end;text-align:left;gap:5px}.portlet-row-label{color:var(--grey-500)}.p-type-text{font-size:.9rem;line-height:1.1rem;text-align:right}.p-type-text-sub{text-align:right;color:var(--grey-500);font-size:.8rem;font-weight:300}.portlet-vertical .portlet-row-value{justify-content:flex-start}.portlet-vertical .portlet-row-label,.portlet-vertical .p-type-text,.portlet-vertical .p-type-text-sub{text-align:left}.content-texttype{display:flex;gap:20px;align-items:center;width:100%}h2{width:100%;font-size:20px;font-weight:600;margin-bottom:15px}\n"], dependencies: [{ kind: "component", type: ItemValueComponent, selector: "ui-item-value", inputs: ["key", "type", "alignment", "row", "disabled", "data", "switchValidation"], outputs: ["switchConfirmed"] }] });
|
|
4889
4924
|
}
|
|
4890
4925
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicPortletCardComponent, decorators: [{
|
|
4891
4926
|
type: Component,
|
|
4892
4927
|
args: [{ selector: 'ui-portlet-card', imports: [
|
|
4893
4928
|
ItemValueComponent
|
|
4894
|
-
], template: "@if ( title) {\r\n <h2>{{title}}</h2>\r\n}\r\n<div class=\"portlet\" \r\n [class.portlet-vertical]=\"layout === 'vertical'\" \r\n [style.gridTemplateColumns]=\"gridTemplateColumns\"\r\n [style]=\"'gap: ' + gap + 'px;'\" >\r\n @for (item of finalData; track $index) {\r\n <div class=\"portlet-row\" [class.portlet-row-vertical]=\"layout === 'vertical'\">\r\n <div class=\"portlet-row-label\" [style.fontWeight]=\"labelWeight\">{{item.label}}:</div>\r\n <div class=\"portlet-row-value\" [style.fontWeight]=\"valueWeight\">\r\n <ui-item-value\r\n [type]=\"item.type??'text'\"\r\n [data]=\"item\"\r\n [switchValidation]=\"switchValidation\"\r\n (switchConfirmed)=\"switchHandler('xx', $event)\"\r\n ></ui-item-value>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".portlet{display:flex;flex-direction:column}.portlet-vertical{display:grid}.portlet-row{display:flex;justify-content:space-between;font-size:.9rem}.portlet-row-vertical{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:4px}.portlet-row-value{display:flex;justify-content:flex-end;text-align:left;gap:5px}.portlet-row-label{color:var(--grey-
|
|
4929
|
+
], template: "@if ( title) {\r\n <h2>{{title}}</h2>\r\n}\r\n<div class=\"portlet\" \r\n [class.portlet-vertical]=\"layout === 'vertical'\" \r\n [style.gridTemplateColumns]=\"gridTemplateColumns\"\r\n [style]=\"'gap: ' + gap + 'px;'\" >\r\n @for (item of finalData; track $index) {\r\n <div class=\"portlet-row\" [class.portlet-row-vertical]=\"layout === 'vertical'\">\r\n <div class=\"portlet-row-label\" [style.fontWeight]=\"labelWeight\">{{item.label}}:</div>\r\n <div class=\"portlet-row-value\" [style.fontWeight]=\"valueWeight\" [style.fontSize.px]=\"valueSize\">\r\n <ui-item-value\r\n [type]=\"item.type??'text'\"\r\n [data]=\"item\"\r\n [switchValidation]=\"switchValidation\"\r\n (switchConfirmed)=\"switchHandler('xx', $event)\"\r\n ></ui-item-value>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".portlet{display:flex;flex-direction:column}.portlet-vertical{display:grid}.portlet-row{display:flex;justify-content:space-between;font-size:.9rem}.portlet-row-vertical{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:4px}.portlet-row-value{display:flex;justify-content:flex-end;text-align:left;gap:5px}.portlet-row-label{color:var(--grey-500)}.p-type-text{font-size:.9rem;line-height:1.1rem;text-align:right}.p-type-text-sub{text-align:right;color:var(--grey-500);font-size:.8rem;font-weight:300}.portlet-vertical .portlet-row-value{justify-content:flex-start}.portlet-vertical .portlet-row-label,.portlet-vertical .p-type-text,.portlet-vertical .p-type-text-sub{text-align:left}.content-texttype{display:flex;gap:20px;align-items:center;width:100%}h2{width:100%;font-size:20px;font-weight:600;margin-bottom:15px}\n"] }]
|
|
4895
4930
|
}], propDecorators: { title: [{
|
|
4896
4931
|
type: Input
|
|
4897
4932
|
}], data: [{
|
|
@@ -4906,6 +4941,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4906
4941
|
type: Input
|
|
4907
4942
|
}], valueWeight: [{
|
|
4908
4943
|
type: Input
|
|
4944
|
+
}], valueSize: [{
|
|
4945
|
+
type: Input
|
|
4909
4946
|
}], switchValidation: [{
|
|
4910
4947
|
type: Input
|
|
4911
4948
|
}] } });
|
|
@@ -4935,7 +4972,7 @@ class UicShortTableComponent {
|
|
|
4935
4972
|
.filter((p) => p !== null);
|
|
4936
4973
|
}
|
|
4937
4974
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicShortTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4938
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UicShortTableComponent, isStandalone: true, selector: "ui-short-table", inputs: { columns: "columns", data: "data", loading: "loading", disabled: "disabled", cols: "cols" }, ngImport: i0, template: "<ui-portlet-card \r\n [gap]=\"20\" \r\n layout=\"vertical\" \r\n [cols]=\"cols\" \r\n [data]=\"portlet\">\r\n</ui-portlet-card>", styles: [".row-body{padding:10px;border:solid 1px var(--grey-200)}\n"], dependencies: [{ kind: "component", type: UicPortletCardComponent, selector: "ui-portlet-card", inputs: ["title", "data", "layout", "cols", "gap", "labelWeight", "valueWeight", "switchValidation"] }] });
|
|
4975
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UicShortTableComponent, isStandalone: true, selector: "ui-short-table", inputs: { columns: "columns", data: "data", loading: "loading", disabled: "disabled", cols: "cols" }, ngImport: i0, template: "<ui-portlet-card \r\n [gap]=\"20\" \r\n layout=\"vertical\" \r\n [cols]=\"cols\" \r\n [data]=\"portlet\">\r\n</ui-portlet-card>", styles: [".row-body{padding:10px;border:solid 1px var(--grey-200)}\n"], dependencies: [{ kind: "component", type: UicPortletCardComponent, selector: "ui-portlet-card", inputs: ["title", "data", "layout", "cols", "gap", "labelWeight", "valueWeight", "valueSize", "switchValidation"] }] });
|
|
4939
4976
|
}
|
|
4940
4977
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicShortTableComponent, decorators: [{
|
|
4941
4978
|
type: Component,
|
|
@@ -5313,11 +5350,11 @@ class UicSkeletonCardsComponent {
|
|
|
5313
5350
|
return this.cards > 0 ? this.cards : 0;
|
|
5314
5351
|
}
|
|
5315
5352
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicSkeletonCardsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5316
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UicSkeletonCardsComponent, isStandalone: true, selector: "ui-skeleton-cards", inputs: { cards: "cards", gap: "gap", minCardWidthPx: "minCardWidthPx" }, ngImport: i0, template: "<div class=\"skeleton-cards-grid\" [ngStyle]=\"gridStyle\">\n @for (card of [].constructor(cardsCount); track $index) {\n <div class=\"skeleton-card skeleton-gradient\"></div>\n }\n</div>\n", styles: [".skeleton-cards-grid{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:24px 0}.skeleton-card{width:100%;aspect-ratio:1/1;border-radius:var(--input-radius)}.skeleton-gradient{background:linear-gradient(90deg,var(--grey-100) 25%,var(--grey-200) 50%,var(--grey-100) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5353
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UicSkeletonCardsComponent, isStandalone: true, selector: "ui-skeleton-cards", inputs: { cards: "cards", gap: "gap", minCardWidthPx: "minCardWidthPx" }, ngImport: i0, template: "<div class=\"skeleton-cards-grid\" [ngStyle]=\"gridStyle\">\r\n @for (card of [].constructor(cardsCount); track $index) {\r\n <div class=\"skeleton-card skeleton-gradient\"></div>\r\n }\r\n</div>\r\n", styles: [".skeleton-cards-grid{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:24px 0}.skeleton-card{width:100%;aspect-ratio:1/1;border-radius:var(--input-radius)}.skeleton-gradient{background:linear-gradient(90deg,var(--grey-100) 25%,var(--grey-200) 50%,var(--grey-100) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5317
5354
|
}
|
|
5318
5355
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicSkeletonCardsComponent, decorators: [{
|
|
5319
5356
|
type: Component,
|
|
5320
|
-
args: [{ selector: 'ui-skeleton-cards', imports: [CommonModule], template: "<div class=\"skeleton-cards-grid\" [ngStyle]=\"gridStyle\">\n @for (card of [].constructor(cardsCount); track $index) {\n <div class=\"skeleton-card skeleton-gradient\"></div>\n }\n</div>\n", styles: [".skeleton-cards-grid{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:24px 0}.skeleton-card{width:100%;aspect-ratio:1/1;border-radius:var(--input-radius)}.skeleton-gradient{background:linear-gradient(90deg,var(--grey-100) 25%,var(--grey-200) 50%,var(--grey-100) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}\n"] }]
|
|
5357
|
+
args: [{ selector: 'ui-skeleton-cards', imports: [CommonModule], template: "<div class=\"skeleton-cards-grid\" [ngStyle]=\"gridStyle\">\r\n @for (card of [].constructor(cardsCount); track $index) {\r\n <div class=\"skeleton-card skeleton-gradient\"></div>\r\n }\r\n</div>\r\n", styles: [".skeleton-cards-grid{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:24px 0}.skeleton-card{width:100%;aspect-ratio:1/1;border-radius:var(--input-radius)}.skeleton-gradient{background:linear-gradient(90deg,var(--grey-100) 25%,var(--grey-200) 50%,var(--grey-100) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}\n"] }]
|
|
5321
5358
|
}], propDecorators: { cards: [{
|
|
5322
5359
|
type: Input
|
|
5323
5360
|
}], gap: [{
|
|
@@ -6525,11 +6562,11 @@ class UicProgressBarComponent {
|
|
|
6525
6562
|
});
|
|
6526
6563
|
}
|
|
6527
6564
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6528
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UicProgressBarComponent, isStandalone: true, selector: "ui-progress-bar", inputs: { progress: "progress", color: "color", height: "height" }, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"'progress-bar pb-' + color\" [style.--pb-height]=\"heightPx\">\
|
|
6565
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UicProgressBarComponent, isStandalone: true, selector: "ui-progress-bar", inputs: { progress: "progress", color: "color", height: "height" }, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"'progress-bar pb-' + color\" [style.--pb-height]=\"heightPx\">\n <div class=\"progress-bar__fill\" [style.width.%]=\"displayProgress\"></div>\n</div>\n", styles: [":host{display:block;width:100%;margin:0;padding:0}.progress-bar{--pb-height: 4px;--progress-fill: var(--primary-600);--progress-track: var(--primary-200);width:100%;height:var(--pb-height);margin:0;padding:0;box-sizing:border-box;border-radius:calc(var(--pb-height) / 2);background-color:var(--progress-track);overflow:hidden}.progress-bar__fill{display:block;height:100%;background-color:var(--progress-fill);border-radius:inherit;width:0%;transition:width .4s ease-in-out;will-change:width}.pb-primary{--progress-fill: var(--primary-600);--progress-track: var(--primary-200)}.pb-secondary{--progress-fill: var(--secondary-600);--progress-track: var(--secondary-200)}.pb-red{--progress-fill: var(--red-600);--progress-track: var(--red-200)}.pb-green{--progress-fill: var(--green-600);--progress-track: var(--green-200)}.pb-blue{--progress-fill: var(--blue-600);--progress-track: var(--blue-200)}.pb-yellow{--progress-fill: var(--yellow-600);--progress-track: var(--yellow-200)}.pb-black{--progress-fill: var(--grey-900);--progress-track: var(--grey-200)}.pb-grey{--progress-fill: var(--grey-600);--progress-track: var(--grey-200)}.pb-white{--progress-fill: var(--white);--progress-track: var(--grey-200)}\n"] });
|
|
6529
6566
|
}
|
|
6530
6567
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UicProgressBarComponent, decorators: [{
|
|
6531
6568
|
type: Component,
|
|
6532
|
-
args: [{ selector: 'ui-progress-bar', imports: [], template: "<div [class]=\"'progress-bar pb-' + color\" [style.--pb-height]=\"heightPx\">\
|
|
6569
|
+
args: [{ selector: 'ui-progress-bar', imports: [], template: "<div [class]=\"'progress-bar pb-' + color\" [style.--pb-height]=\"heightPx\">\n <div class=\"progress-bar__fill\" [style.width.%]=\"displayProgress\"></div>\n</div>\n", styles: [":host{display:block;width:100%;margin:0;padding:0}.progress-bar{--pb-height: 4px;--progress-fill: var(--primary-600);--progress-track: var(--primary-200);width:100%;height:var(--pb-height);margin:0;padding:0;box-sizing:border-box;border-radius:calc(var(--pb-height) / 2);background-color:var(--progress-track);overflow:hidden}.progress-bar__fill{display:block;height:100%;background-color:var(--progress-fill);border-radius:inherit;width:0%;transition:width .4s ease-in-out;will-change:width}.pb-primary{--progress-fill: var(--primary-600);--progress-track: var(--primary-200)}.pb-secondary{--progress-fill: var(--secondary-600);--progress-track: var(--secondary-200)}.pb-red{--progress-fill: var(--red-600);--progress-track: var(--red-200)}.pb-green{--progress-fill: var(--green-600);--progress-track: var(--green-200)}.pb-blue{--progress-fill: var(--blue-600);--progress-track: var(--blue-200)}.pb-yellow{--progress-fill: var(--yellow-600);--progress-track: var(--yellow-200)}.pb-black{--progress-fill: var(--grey-900);--progress-track: var(--grey-200)}.pb-grey{--progress-fill: var(--grey-600);--progress-track: var(--grey-200)}.pb-white{--progress-fill: var(--white);--progress-track: var(--grey-200)}\n"] }]
|
|
6533
6570
|
}], propDecorators: { progress: [{
|
|
6534
6571
|
type: Input
|
|
6535
6572
|
}], color: [{
|