ngx-eiffage-material 0.4.0 → 0.5.0
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.
|
@@ -22,7 +22,7 @@ import * as i3 from '@angular/material/select';
|
|
|
22
22
|
import { MatSelectModule } from '@angular/material/select';
|
|
23
23
|
import * as i11 from '@angular/common';
|
|
24
24
|
import { NgTemplateOutlet, CommonModule, DatePipe, isPlatformBrowser, LowerCasePipe } from '@angular/common';
|
|
25
|
-
import { MatDialogRef,
|
|
25
|
+
import { MatDialogRef, MatDialogTitle, MAT_DIALOG_DATA, MatDialogContent, MatDialogActions, MatDialogClose, MatDialog } from '@angular/material/dialog';
|
|
26
26
|
import * as i14 from '@angular/material/checkbox';
|
|
27
27
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
28
28
|
import * as i10 from '@angular/material/datepicker';
|
|
@@ -1338,6 +1338,52 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
1338
1338
|
}]
|
|
1339
1339
|
}], ctorParameters: () => [], propDecorators: { component: [{ type: i0.Input, args: [{ isSignal: true, alias: "component", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }] } });
|
|
1340
1340
|
|
|
1341
|
+
/**
|
|
1342
|
+
* Encabezado de diálogo con botón X para cerrar: el mismo que usa ngx-dialog, para diálogos propios
|
|
1343
|
+
* abiertos con MatDialog. Va en lugar de `<h2 mat-dialog-title>`:
|
|
1344
|
+
*
|
|
1345
|
+
* ```html
|
|
1346
|
+
* <ngx-dialog-header [title]="'Editar proyecto'" icon="edit" />
|
|
1347
|
+
* <!-- o con contenido propio -->
|
|
1348
|
+
* <ngx-dialog-header>{{ (isNew ? 'PROJECTS.create' : 'PROJECTS.edit') | translate }}</ngx-dialog-header>
|
|
1349
|
+
* ```
|
|
1350
|
+
*/
|
|
1351
|
+
class NgxDialogHeader {
|
|
1352
|
+
_dialogRef = inject(MatDialogRef, { optional: true });
|
|
1353
|
+
texts = inject(NgxTexts).texts;
|
|
1354
|
+
/** Título. También se puede poner como contenido (`<ngx-dialog-header>…</ngx-dialog-header>`). */
|
|
1355
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
1356
|
+
/** Línea secundaria bajo el título. */
|
|
1357
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
1358
|
+
/** Icono de Material Symbols delante del título. */
|
|
1359
|
+
icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
|
|
1360
|
+
/** Color del icono (p. ej. `var(--mat-sys-error)`). */
|
|
1361
|
+
iconColor = input(...(ngDevMode ? [undefined, { debugName: "iconColor" }] : []));
|
|
1362
|
+
/**
|
|
1363
|
+
* Muestra la X. Sin indicar, se ve mientras el diálogo se pueda cerrar: se oculta si el diálogo tiene
|
|
1364
|
+
* `disableClose` (también si se activa después, p. ej. durante una subida) y vuelve al quitarlo.
|
|
1365
|
+
*/
|
|
1366
|
+
showClose = input(undefined, ...(ngDevMode ? [{ debugName: "showClose" }] : []));
|
|
1367
|
+
/** Valor con el que se cierra al pulsar la X. Por defecto `undefined`, igual que con Esc o al pulsar fuera. */
|
|
1368
|
+
closeResult = input(undefined, ...(ngDevMode ? [{ debugName: "closeResult" }] : []));
|
|
1369
|
+
/** disableClose es una propiedad normal del MatDialogRef: se lee en cada comprobación. */
|
|
1370
|
+
_closable = signal(!this._dialogRef?.disableClose, ...(ngDevMode ? [{ debugName: "_closable" }] : []));
|
|
1371
|
+
closeVisible = computed(() => !!this._dialogRef && (this.showClose() ?? this._closable()), ...(ngDevMode ? [{ debugName: "closeVisible" }] : []));
|
|
1372
|
+
ngDoCheck() {
|
|
1373
|
+
this._closable.set(!this._dialogRef?.disableClose);
|
|
1374
|
+
}
|
|
1375
|
+
/** Cierra el diálogo con `closeResult`. */
|
|
1376
|
+
close() {
|
|
1377
|
+
this._dialogRef?.close(this.closeResult());
|
|
1378
|
+
}
|
|
1379
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NgxDialogHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1380
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NgxDialogHeader, isStandalone: true, selector: "ngx-dialog-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, showClose: { classPropertyName: "showClose", publicName: "showClose", isSignal: true, isRequired: false, transformFunction: null }, closeResult: { classPropertyName: "closeResult", publicName: "closeResult", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<!--\n El h2 (mat-dialog-title) da el nombre accesible al di\u00E1logo, as\u00ED que la X va fuera de \u00E9l,\n posicionada encima, para que no forme parte de ese nombre.\n-->\n<div class=\"ngx-dialog__header\" [class.ngx-dialog__header--closable]=\"closeVisible()\">\n <h2 mat-dialog-title class=\"ngx-dialog__title\">\n @if (icon()) {\n <mat-icon class=\"ngx-dialog__icon\" [style.color]=\"iconColor() || null\" aria-hidden=\"true\">{{ icon() }}</mat-icon>\n }\n <span class=\"ngx-dialog__heading\">\n <span class=\"ngx-dialog__title-text\">{{ title() }}<ng-content /></span>\n @if (subtitle()) {\n <span class=\"ngx-dialog__subtitle\">{{ subtitle() }}</span>\n }\n </span>\n </h2>\n\n @if (closeVisible()) {\n <button\n type=\"button\"\n matIconButton\n class=\"ngx-dialog__close\"\n [attr.aria-label]=\"texts().dialog.close\"\n [matTooltip]=\"texts().dialog.close\"\n (click)=\"close()\">\n <mat-icon>close</mat-icon>\n </button>\n }\n</div>\n", styles: [":host{display:block}.ngx-dialog__header{position:relative}.ngx-dialog__title.mat-mdc-dialog-title{display:flex;align-items:center;gap:12px;margin:0;padding:18px 24px 16px}.ngx-dialog__title.mat-mdc-dialog-title:before{display:none}.ngx-dialog__header--closable .ngx-dialog__title.mat-mdc-dialog-title{padding-right:64px}.ngx-dialog__icon{flex:none;width:28px;height:28px;font-size:28px}.ngx-dialog__heading{display:flex;flex-direction:column;gap:2px;min-width:0}.ngx-dialog__title-text{font:var(--mat-sys-title-large);color:var(--mat-sys-on-surface);overflow-wrap:anywhere}.ngx-dialog__subtitle{font:var(--mat-sys-body-medium);color:var(--mat-sys-on-surface-variant)}.ngx-dialog__close{position:absolute;top:50%;right:12px;transform:translateY(-50%);color:var(--mat-sys-on-surface-variant)}\n"], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1381
|
+
}
|
|
1382
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NgxDialogHeader, decorators: [{
|
|
1383
|
+
type: Component,
|
|
1384
|
+
args: [{ selector: 'ngx-dialog-header', imports: [MatDialogTitle, MatButtonModule, MatIconModule, MatTooltipModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n El h2 (mat-dialog-title) da el nombre accesible al di\u00E1logo, as\u00ED que la X va fuera de \u00E9l,\n posicionada encima, para que no forme parte de ese nombre.\n-->\n<div class=\"ngx-dialog__header\" [class.ngx-dialog__header--closable]=\"closeVisible()\">\n <h2 mat-dialog-title class=\"ngx-dialog__title\">\n @if (icon()) {\n <mat-icon class=\"ngx-dialog__icon\" [style.color]=\"iconColor() || null\" aria-hidden=\"true\">{{ icon() }}</mat-icon>\n }\n <span class=\"ngx-dialog__heading\">\n <span class=\"ngx-dialog__title-text\">{{ title() }}<ng-content /></span>\n @if (subtitle()) {\n <span class=\"ngx-dialog__subtitle\">{{ subtitle() }}</span>\n }\n </span>\n </h2>\n\n @if (closeVisible()) {\n <button\n type=\"button\"\n matIconButton\n class=\"ngx-dialog__close\"\n [attr.aria-label]=\"texts().dialog.close\"\n [matTooltip]=\"texts().dialog.close\"\n (click)=\"close()\">\n <mat-icon>close</mat-icon>\n </button>\n }\n</div>\n", styles: [":host{display:block}.ngx-dialog__header{position:relative}.ngx-dialog__title.mat-mdc-dialog-title{display:flex;align-items:center;gap:12px;margin:0;padding:18px 24px 16px}.ngx-dialog__title.mat-mdc-dialog-title:before{display:none}.ngx-dialog__header--closable .ngx-dialog__title.mat-mdc-dialog-title{padding-right:64px}.ngx-dialog__icon{flex:none;width:28px;height:28px;font-size:28px}.ngx-dialog__heading{display:flex;flex-direction:column;gap:2px;min-width:0}.ngx-dialog__title-text{font:var(--mat-sys-title-large);color:var(--mat-sys-on-surface);overflow-wrap:anywhere}.ngx-dialog__subtitle{font:var(--mat-sys-body-medium);color:var(--mat-sys-on-surface-variant)}.ngx-dialog__close{position:absolute;top:50%;right:12px;transform:translateY(-50%);color:var(--mat-sys-on-surface-variant)}\n"] }]
|
|
1385
|
+
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconColor", required: false }] }], showClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClose", required: false }] }], closeResult: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeResult", required: false }] }] } });
|
|
1386
|
+
|
|
1341
1387
|
/**
|
|
1342
1388
|
* Diálogo genérico que abre NgxDialogService. El contenido (texto, HTML, componente o plantilla)
|
|
1343
1389
|
* puede usar NgxDialogContext para devolver un resultado o deshabilitar el botón de confirmar.
|
|
@@ -1356,7 +1402,6 @@ class NgxDialog {
|
|
|
1356
1402
|
destructive = this._data.destructive ?? false;
|
|
1357
1403
|
/** La X no tiene sentido en un diálogo con disableClose (está pensado para no poder cerrarse sin decidir). */
|
|
1358
1404
|
showClose = this._data.showClose ?? !this._dialogRef.disableClose;
|
|
1359
|
-
closeLabel = this._texts().dialog.close;
|
|
1360
1405
|
cancelText = this._data.cancelText ?? this._texts().dialog.cancel;
|
|
1361
1406
|
confirmText = this._data.confirmText ?? this._texts().dialog.accept;
|
|
1362
1407
|
// ── NgxDialogContext ──────────────────────────────────────────────────────
|
|
@@ -1381,20 +1426,18 @@ class NgxDialog {
|
|
|
1381
1426
|
this._dialogRef.close(result === undefined ? true : result);
|
|
1382
1427
|
}
|
|
1383
1428
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NgxDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1384
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NgxDialog, isStandalone: true, selector: "ngx-dialog", providers: [{ provide: NgxDialogContext, useExisting: forwardRef(() => NgxDialog) }], ngImport: i0, template: "
|
|
1429
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NgxDialog, isStandalone: true, selector: "ngx-dialog", providers: [{ provide: NgxDialogContext, useExisting: forwardRef(() => NgxDialog) }], ngImport: i0, template: "<!-- Encabezado compartido con los di\u00E1logos propios (ngx-dialog-header) -->\r\n<ngx-dialog-header\r\n [title]=\"title\"\r\n [subtitle]=\"subtitle\"\r\n [icon]=\"icon\"\r\n [iconColor]=\"iconColor\"\r\n [showClose]=\"showClose\" />\r\n\r\n<mat-dialog-content>\r\n <div class=\"ngx-dialog__content\">\r\n @switch (body.type) {\r\n @case (DialogBodyType.TEXT) {\r\n <p class=\"ngx-dialog__text\">{{ body.content }}</p>\r\n }\r\n @case (DialogBodyType.HTML) {\r\n <div [innerHTML]=\"body.content\"></div>\r\n }\r\n @case (DialogBodyType.COMPONENT) {\r\n <ng-container\r\n ngxDynamicHost\r\n [component]=\"$any(body.content)\"\r\n [data]=\"body.data\"\r\n />\r\n }\r\n @case (DialogBodyType.TEMPLATE) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"$any(body.content)\"\r\n [ngTemplateOutletContext]=\"templateContext\"\r\n />\r\n }\r\n }\r\n </div>\r\n</mat-dialog-content>\r\n\r\n@if (showCancel || showConfirm) {\r\n <mat-dialog-actions align=\"end\" class=\"ngx-dialog__actions\">\r\n @if (showCancel) {\r\n <button type=\"button\" matButton=\"outlined\" (click)=\"onCancelClick()\">\r\n {{ cancelText }}\r\n </button>\r\n }\r\n @if (showConfirm) {\r\n <button\r\n type=\"button\"\r\n matButton=\"filled\"\r\n class=\"ngx-dialog__confirm\"\r\n [class.ngx-dialog__confirm--destructive]=\"destructive\"\r\n [disabled]=\"confirmDisabled()\"\r\n (click)=\"onConfirmClick()\">\r\n {{ confirmText }}\r\n </button>\r\n }\r\n </mat-dialog-actions>\r\n}\r\n", styles: [":host{display:block}.ngx-dialog__content{padding-top:4px}.ngx-dialog__text{margin:0;white-space:pre-line}.ngx-dialog__actions{gap:8px}.ngx-dialog__confirm--destructive{--mat-button-filled-container-color: var(--mat-sys-error);--mat-button-filled-label-text-color: var(--mat-sys-on-error);--mat-button-filled-state-layer-color: var(--mat-sys-on-error)}\n"], dependencies: [{ kind: "component", type: NgxDialogHeader, selector: "ngx-dialog-header", inputs: ["title", "subtitle", "icon", "iconColor", "showClose", "closeResult"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: DynamicHostDirective, selector: "[ngxDynamicHost]", inputs: ["component", "data"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1385
1430
|
}
|
|
1386
1431
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NgxDialog, decorators: [{
|
|
1387
1432
|
type: Component,
|
|
1388
1433
|
args: [{ selector: 'ngx-dialog', imports: [
|
|
1389
|
-
|
|
1434
|
+
NgxDialogHeader,
|
|
1390
1435
|
MatDialogContent,
|
|
1391
1436
|
MatDialogActions,
|
|
1392
1437
|
MatButtonModule,
|
|
1393
|
-
MatIconModule,
|
|
1394
|
-
MatTooltipModule,
|
|
1395
1438
|
NgTemplateOutlet,
|
|
1396
1439
|
DynamicHostDirective,
|
|
1397
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: NgxDialogContext, useExisting: forwardRef(() => NgxDialog) }], template: "
|
|
1440
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: NgxDialogContext, useExisting: forwardRef(() => NgxDialog) }], template: "<!-- Encabezado compartido con los di\u00E1logos propios (ngx-dialog-header) -->\r\n<ngx-dialog-header\r\n [title]=\"title\"\r\n [subtitle]=\"subtitle\"\r\n [icon]=\"icon\"\r\n [iconColor]=\"iconColor\"\r\n [showClose]=\"showClose\" />\r\n\r\n<mat-dialog-content>\r\n <div class=\"ngx-dialog__content\">\r\n @switch (body.type) {\r\n @case (DialogBodyType.TEXT) {\r\n <p class=\"ngx-dialog__text\">{{ body.content }}</p>\r\n }\r\n @case (DialogBodyType.HTML) {\r\n <div [innerHTML]=\"body.content\"></div>\r\n }\r\n @case (DialogBodyType.COMPONENT) {\r\n <ng-container\r\n ngxDynamicHost\r\n [component]=\"$any(body.content)\"\r\n [data]=\"body.data\"\r\n />\r\n }\r\n @case (DialogBodyType.TEMPLATE) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"$any(body.content)\"\r\n [ngTemplateOutletContext]=\"templateContext\"\r\n />\r\n }\r\n }\r\n </div>\r\n</mat-dialog-content>\r\n\r\n@if (showCancel || showConfirm) {\r\n <mat-dialog-actions align=\"end\" class=\"ngx-dialog__actions\">\r\n @if (showCancel) {\r\n <button type=\"button\" matButton=\"outlined\" (click)=\"onCancelClick()\">\r\n {{ cancelText }}\r\n </button>\r\n }\r\n @if (showConfirm) {\r\n <button\r\n type=\"button\"\r\n matButton=\"filled\"\r\n class=\"ngx-dialog__confirm\"\r\n [class.ngx-dialog__confirm--destructive]=\"destructive\"\r\n [disabled]=\"confirmDisabled()\"\r\n (click)=\"onConfirmClick()\">\r\n {{ confirmText }}\r\n </button>\r\n }\r\n </mat-dialog-actions>\r\n}\r\n", styles: [":host{display:block}.ngx-dialog__content{padding-top:4px}.ngx-dialog__text{margin:0;white-space:pre-line}.ngx-dialog__actions{gap:8px}.ngx-dialog__confirm--destructive{--mat-button-filled-container-color: var(--mat-sys-error);--mat-button-filled-label-text-color: var(--mat-sys-on-error);--mat-button-filled-state-layer-color: var(--mat-sys-on-error)}\n"] }]
|
|
1398
1441
|
}] });
|
|
1399
1442
|
|
|
1400
1443
|
/**
|
|
@@ -4970,5 +5013,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
4970
5013
|
* Generated bundle index. Do not edit.
|
|
4971
5014
|
*/
|
|
4972
5015
|
|
|
4973
|
-
export { AdvancedFilterService, AdvancedFilterUtils, ColumnConfigService, DatosPantallaService, DialogBodyType, DynamicHostDirective, NGX_EIFFAGE_DEFAULT_TEXTS, NGX_EIFFAGE_TEXTS, NgxAlert, NgxBasicSelect, NgxBasicTable, NgxConfirmDialogComponent, NgxDialog, NgxDialogContext, NgxDialogService, NgxFileInput, NgxInputFile, NgxLoadingButton, NgxPaginatedSelect, NgxPaginatedSelectBottomSheetComponent, NgxPaginatedTable, NgxSkeleton, NgxTablesIntl, NgxTexts, OPERATOR_BY_FILTER_TYPE, PaginatedSearchableSelectComponent, SearchableSelectComponent, USER_ID_FACTORY, base64ToUtf8, includeNoSensible, isFilterOption, provideNgxEiffageTexts };
|
|
5016
|
+
export { AdvancedFilterService, AdvancedFilterUtils, ColumnConfigService, DatosPantallaService, DialogBodyType, DynamicHostDirective, NGX_EIFFAGE_DEFAULT_TEXTS, NGX_EIFFAGE_TEXTS, NgxAlert, NgxBasicSelect, NgxBasicTable, NgxConfirmDialogComponent, NgxDialog, NgxDialogContext, NgxDialogHeader, NgxDialogService, NgxFileInput, NgxInputFile, NgxLoadingButton, NgxPaginatedSelect, NgxPaginatedSelectBottomSheetComponent, NgxPaginatedTable, NgxSkeleton, NgxTablesIntl, NgxTexts, OPERATOR_BY_FILTER_TYPE, PaginatedSearchableSelectComponent, SearchableSelectComponent, USER_ID_FACTORY, base64ToUtf8, includeNoSensible, isFilterOption, provideNgxEiffageTexts };
|
|
4974
5017
|
//# sourceMappingURL=ngx-eiffage-material.mjs.map
|