structra-ui 0.1.76 → 0.1.78
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/structra-ui.mjs +65 -4
- package/fesm2022/structra-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/structra-ui.css +1 -1
- package/types/structra-ui.d.ts +17 -1
package/fesm2022/structra-ui.mjs
CHANGED
|
@@ -4,7 +4,7 @@ import { booleanAttribute, HostBinding, Input, ChangeDetectionStrategy, Componen
|
|
|
4
4
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
5
5
|
import * as i1 from '@angular/forms';
|
|
6
6
|
import { Validators, FormGroupDirective, NgForm, NgControl, NG_VALUE_ACCESSOR, FormsModule, FormGroup, FormArray, FormControl } from '@angular/forms';
|
|
7
|
-
import { NgClass, NgTemplateOutlet, NgStyle } from '@angular/common';
|
|
7
|
+
import { NgClass, NgTemplateOutlet, DOCUMENT, NgStyle } from '@angular/common';
|
|
8
8
|
import { CdkConnectedOverlay, CdkOverlayOrigin, Overlay } from '@angular/cdk/overlay';
|
|
9
9
|
import { merge, distinctUntilChanged, fromEvent, timer, firstValueFrom } from 'rxjs';
|
|
10
10
|
import * as i2 from '@angular/material/datepicker';
|
|
@@ -5912,7 +5912,13 @@ class ValidationSummaryComponent {
|
|
|
5912
5912
|
this.appRef = inject(ApplicationRef);
|
|
5913
5913
|
this.cdr = inject(ChangeDetectorRef);
|
|
5914
5914
|
this.injector = inject(Injector);
|
|
5915
|
+
this.document = inject(DOCUMENT);
|
|
5915
5916
|
this.hostRef = inject((ElementRef));
|
|
5917
|
+
/**
|
|
5918
|
+
* Id estável do painel — quando o nó `pinned` passa a `document.body` (Safari iOS) o
|
|
5919
|
+
* `getElementById` permite reintegrá-lo no host antes do `@if` o destruir.
|
|
5920
|
+
*/
|
|
5921
|
+
this.panelDomId = `structra-vsum-p-${++ValidationSummaryComponent.nextPanelDomId}`;
|
|
5916
5922
|
/** `id` único para `aria-labelledby` quando há vários resumos na página. */
|
|
5917
5923
|
this.titleElementId = `validation-summary-title-${++ValidationSummaryComponent.nextTitleUid}`;
|
|
5918
5924
|
/** `id` da região da lista (acessibilidade do botão recolher / expandir). */
|
|
@@ -5977,6 +5983,7 @@ class ValidationSummaryComponent {
|
|
|
5977
5983
|
}
|
|
5978
5984
|
static { this.nextTitleUid = 0; }
|
|
5979
5985
|
static { this.nextListRegionUid = 0; }
|
|
5986
|
+
static { this.nextPanelDomId = 0; }
|
|
5980
5987
|
get hostClass() {
|
|
5981
5988
|
const parts = [
|
|
5982
5989
|
'validation-summary',
|
|
@@ -5991,6 +5998,9 @@ class ValidationSummaryComponent {
|
|
|
5991
5998
|
return parts.join(' ');
|
|
5992
5999
|
}
|
|
5993
6000
|
ngOnChanges(c) {
|
|
6001
|
+
if (!this.isShown) {
|
|
6002
|
+
this.repatriatePinnedPanelToHost();
|
|
6003
|
+
}
|
|
5994
6004
|
const shown = this.isShown;
|
|
5995
6005
|
if (this.pinned && shown && !this.wasShown) {
|
|
5996
6006
|
this.pinnedOpen = false;
|
|
@@ -6017,6 +6027,54 @@ class ValidationSummaryComponent {
|
|
|
6017
6027
|
}
|
|
6018
6028
|
}
|
|
6019
6029
|
this.wasShown = shown;
|
|
6030
|
+
if (shown) {
|
|
6031
|
+
afterNextRender(() => this.syncPinnedBodyPlacement(), { injector: this.injector });
|
|
6032
|
+
}
|
|
6033
|
+
}
|
|
6034
|
+
ngOnDestroy() {
|
|
6035
|
+
const el = this.getPanelElement();
|
|
6036
|
+
if (el && el.parentElement === this.document.body) {
|
|
6037
|
+
try {
|
|
6038
|
+
this.hostRef.nativeElement.appendChild(el);
|
|
6039
|
+
}
|
|
6040
|
+
catch {
|
|
6041
|
+
el.remove();
|
|
6042
|
+
}
|
|
6043
|
+
}
|
|
6044
|
+
}
|
|
6045
|
+
getPanelElement() {
|
|
6046
|
+
return (this.document.getElementById(this.panelDomId) ??
|
|
6047
|
+
this.panelRootRef?.nativeElement ??
|
|
6048
|
+
null);
|
|
6049
|
+
}
|
|
6050
|
+
repatriatePinnedPanelToHost() {
|
|
6051
|
+
const el = this.getPanelElement();
|
|
6052
|
+
if (!el || el.parentElement !== this.document.body) {
|
|
6053
|
+
return;
|
|
6054
|
+
}
|
|
6055
|
+
this.hostRef.nativeElement.appendChild(el);
|
|
6056
|
+
}
|
|
6057
|
+
/**
|
|
6058
|
+
* Safari iOS: `position: fixed` no painel, por baixo de scroll (`main`), fica abaixo do topbar
|
|
6059
|
+
* a não ser com `z-index` ardiloso — o painel anexa-se a `body` (fora de qualquer overflow).
|
|
6060
|
+
*/
|
|
6061
|
+
syncPinnedBodyPlacement() {
|
|
6062
|
+
if (!this.isShown) {
|
|
6063
|
+
return;
|
|
6064
|
+
}
|
|
6065
|
+
const el = this.getPanelElement();
|
|
6066
|
+
if (!el) {
|
|
6067
|
+
return;
|
|
6068
|
+
}
|
|
6069
|
+
if (this.pinned) {
|
|
6070
|
+
if (el.parentElement !== this.document.body) {
|
|
6071
|
+
this.document.body.appendChild(el);
|
|
6072
|
+
}
|
|
6073
|
+
return;
|
|
6074
|
+
}
|
|
6075
|
+
if (el.parentElement === this.document.body) {
|
|
6076
|
+
this.hostRef.nativeElement.appendChild(el);
|
|
6077
|
+
}
|
|
6020
6078
|
}
|
|
6021
6079
|
get hostHidden() {
|
|
6022
6080
|
return this.isShown ? null : true;
|
|
@@ -6284,12 +6342,15 @@ class ValidationSummaryComponent {
|
|
|
6284
6342
|
return tab != null && tab !== '-1';
|
|
6285
6343
|
}
|
|
6286
6344
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ValidationSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6287
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ValidationSummaryComponent, isStandalone: true, selector: "app-validation-summary", inputs: { messages: "messages", items: "items", summaryHeading: ["title", "summaryHeading"], visible: ["visible", "visible", booleanAttribute], pinned: ["pinned", "pinned", booleanAttribute], autoScrollOnReveal: ["autoScrollOnReveal", "autoScrollOnReveal", booleanAttribute], unpinnedScrollTick: "unpinnedScrollTick", variant: "variant", compact: ["compact", "compact", booleanAttribute], panelMaxHeight: "panelMaxHeight", scrollBehavior: "scrollBehavior", beforeItemActivate: "beforeItemActivate", showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute], showListCollapseToggle: ["showListCollapseToggle", "showListCollapseToggle", booleanAttribute], closeButtonLabel: "closeButtonLabel", fieldNavigateHint: "fieldNavigateHint" }, outputs: { panelClose: "panelClose" }, host: { properties: { "class": "this.hostClass", "attr.hidden": "this.hostHidden" } }, usesOnChanges: true, ngImport: i0, template: "@if (isShown) {\r\n<div class=\"validation-summary__panel\" role=\"region\"\r\n [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n [class.validation-summary__panel--pinned]=\"pinned\"\r\n [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\">\r\n <div class=\"validation-summary__head\">\r\n @if (showListCollapseToggle) {\r\n <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n </button>\r\n }\r\n @if (summaryHeading.trim()) {\r\n <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n {{ summaryHeading }}\r\n </h3>\r\n }\r\n @if (showCloseButton) {\r\n <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n {{ closeButtonLabel }}\r\n </button>\r\n }\r\n </div>\r\n <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n <ul class=\"validation-summary__list\" role=\"list\">\r\n @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n @if (row.fieldId) {\r\n <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n {{ row.message }}\r\n </button>\r\n } @else {\r\n <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n }\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;scroll-margin-top:.75rem;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none;scroll-margin-top:0}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned, 1400);top:max(.65rem,env(safe-area-inset-top,0px));left:1rem;right:1rem;width:auto;max-width:min(100%,52rem);margin-left:auto;margin-right:auto;box-sizing:border-box;pointer-events:auto;box-shadow:0 4px 6px -1px #00000014,0 10px 24px -6px #0000001f;transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;transition:opacity .2s ease-out}.validation-summary__panel.validation-summary__panel--pinned.validation-summary__panel--pinned-open{opacity:1}.validation-summary__panel{width:100%;border-radius:10px;padding:.85rem 1rem;box-sizing:border-box;border:1px solid transparent}.validation-summary__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.45rem .75rem;margin-bottom:.55rem}.validation-summary__panel--list-collapsed .validation-summary__head{margin-bottom:0}.validation-summary__collapse-toggle{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.8rem;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__collapse-toggle:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__collapse-toggle:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__title{margin:0;flex:1 1 auto;min-width:0;font-size:1rem;font-weight:600;line-height:1.35;user-select:none;-webkit-user-select:none}.validation-summary__close{flex-shrink:0;margin:0 0 0 auto;padding:.3rem .7rem;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.85rem;font-weight:500;font-family:inherit;line-height:1.3;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__close:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__close:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__list-wrap{min-width:0;user-select:none;-webkit-user-select:none;overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin .2s ease}.validation-summary__list-wrap--collapsed{max-height:0!important;opacity:0;margin:0;padding:0;pointer-events:none}.validation-summary__list-wrap--scrollable{overflow-y:auto;overflow-x:hidden;padding-right:.15rem;scrollbar-gutter:stable}.validation-summary__list{margin:0;padding:0;list-style:none}.validation-summary__item{display:flex;align-items:flex-start;gap:.4rem;margin:.2rem 0;padding:0;line-height:1.45;color:var(--ui-validation-summary-text, #1a1a1a);user-select:none;-webkit-user-select:none}.validation-summary__item:before{content:\"\\2022\";flex-shrink:0;line-height:inherit;color:var(--ui-validation-summary-text, #1a1a1a)}.validation-summary__text{display:inline;font:inherit;user-select:none;-webkit-user-select:none}.validation-summary__link{flex:1;min-width:0;display:block;margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:.12em;cursor:pointer;user-select:none;-webkit-user-select:none}.validation-summary__link:hover{color:var(--ui-validation-summary-link-hover, #0d47a1)}.validation-summary__link:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px;border-radius:4px}:host.validation-summary--error .validation-summary__link:hover{color:var(--app-color-error, #b91c1c)}:host.validation-summary--error .validation-summary__panel{background:var(--ui-validation-summary-bg-error, #ffebee);border-color:var(--ui-validation-summary-border-error, #ffcdd2)}:host.validation-summary--error .validation-summary__title{color:var(--ui-validation-summary-title-error, #b71c1c)}:host.validation-summary--warning .validation-summary__panel{background:var(--ui-validation-summary-bg-warning, #fff8e1);border-color:var(--ui-validation-summary-border-warning, #ffe082)}:host.validation-summary--warning .validation-summary__title{color:var(--ui-validation-summary-title-warning, #e65100)}:host.validation-summary--warning .validation-summary__close{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}:host.validation-summary--warning .validation-summary__collapse-toggle:hover{border-color:#e651008c}:host.validation-summary--info .validation-summary__panel{background:var(--ui-validation-summary-bg-info, #e3f2fd);border-color:var(--ui-validation-summary-border-info, #90caf9)}:host.validation-summary--info .validation-summary__title{color:var(--ui-validation-summary-title-info, #0d47a1)}:host.validation-summary--info .validation-summary__close{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}:host.validation-summary--info .validation-summary__collapse-toggle:hover{border-color:#0d47a18c}:host.validation-summary--compact .validation-summary__panel{padding:.55rem .7rem}:host.validation-summary--compact .validation-summary__head{margin-bottom:.35rem}:host.validation-summary--compact .validation-summary__title{font-size:.92rem}:host.validation-summary--compact .validation-summary__list{padding-left:0}:host.validation-summary--compact .validation-summary__item{font-size:.88rem;margin:.12rem 0}:host.validation-summary--compact .validation-summary__collapse-toggle{width:1.75rem;height:1.75rem;font-size:.72rem}@media(max-width:30rem){.validation-summary__title{font-size:.875rem}:host.validation-summary--compact .validation-summary__title{font-size:.82rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6345
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ValidationSummaryComponent, isStandalone: true, selector: "app-validation-summary", inputs: { messages: "messages", items: "items", summaryHeading: ["title", "summaryHeading"], visible: ["visible", "visible", booleanAttribute], pinned: ["pinned", "pinned", booleanAttribute], autoScrollOnReveal: ["autoScrollOnReveal", "autoScrollOnReveal", booleanAttribute], unpinnedScrollTick: "unpinnedScrollTick", variant: "variant", compact: ["compact", "compact", booleanAttribute], panelMaxHeight: "panelMaxHeight", scrollBehavior: "scrollBehavior", beforeItemActivate: "beforeItemActivate", showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute], showListCollapseToggle: ["showListCollapseToggle", "showListCollapseToggle", booleanAttribute], closeButtonLabel: "closeButtonLabel", fieldNavigateHint: "fieldNavigateHint" }, outputs: { panelClose: "panelClose" }, host: { properties: { "class": "this.hostClass", "attr.hidden": "this.hostHidden" } }, viewQueries: [{ propertyName: "panelRootRef", first: true, predicate: ["panelRoot"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "@if (isShown) {\r\n<div #panelRoot\r\n [attr.id]=\"panelDomId\"\r\n class=\"validation-summary__panel\" role=\"region\"\r\n [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n [class.validation-summary__panel--pinned]=\"pinned\"\r\n [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\"\r\n [class.validation-summary__panel--surface-error]=\"variant === 'error'\"\r\n [class.validation-summary__panel--surface-warning]=\"variant === 'warning'\"\r\n [class.validation-summary__panel--surface-info]=\"variant === 'info'\"\r\n [class.validation-summary__panel--size-compact]=\"compact\">\r\n <div class=\"validation-summary__head\">\r\n @if (showListCollapseToggle) {\r\n <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n </button>\r\n }\r\n @if (summaryHeading.trim()) {\r\n <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n {{ summaryHeading }}\r\n </h3>\r\n }\r\n @if (showCloseButton) {\r\n <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n {{ closeButtonLabel }}\r\n </button>\r\n }\r\n </div>\r\n <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n <ul class=\"validation-summary__list\" role=\"list\">\r\n @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n @if (row.fieldId) {\r\n <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n {{ row.message }}\r\n </button>\r\n } @else {\r\n <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n }\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;scroll-margin-top:.75rem;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none;scroll-margin-top:0}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned, 10000);isolation:isolate;top:max(.65rem,env(safe-area-inset-top,0px));left:1rem;right:1rem;width:auto;max-width:min(100%,52rem);margin-left:auto;margin-right:auto;box-sizing:border-box;pointer-events:auto;box-shadow:0 4px 6px -1px #00000014,0 10px 24px -6px #0000001f;transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;transition:opacity .2s ease-out}.validation-summary__panel.validation-summary__panel--pinned.validation-summary__panel--pinned-open{opacity:1}.validation-summary__panel{width:100%;border-radius:10px;padding:.85rem 1rem;box-sizing:border-box;border:1px solid transparent}.validation-summary__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.45rem .75rem;margin-bottom:.55rem}.validation-summary__panel--list-collapsed .validation-summary__head{margin-bottom:0}.validation-summary__collapse-toggle{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.8rem;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__collapse-toggle:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__collapse-toggle:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__title{margin:0;flex:1 1 auto;min-width:0;font-size:1rem;font-weight:600;line-height:1.35;user-select:none;-webkit-user-select:none}.validation-summary__close{flex-shrink:0;margin:0 0 0 auto;padding:.3rem .7rem;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.85rem;font-weight:500;font-family:inherit;line-height:1.3;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__close:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__close:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__list-wrap{min-width:0;user-select:none;-webkit-user-select:none;overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin .2s ease}.validation-summary__list-wrap--collapsed{max-height:0!important;opacity:0;margin:0;padding:0;pointer-events:none}.validation-summary__list-wrap--scrollable{overflow-y:auto;overflow-x:hidden;padding-right:.15rem;scrollbar-gutter:stable}.validation-summary__list{margin:0;padding:0;list-style:none}.validation-summary__item{display:flex;align-items:flex-start;gap:.4rem;margin:.2rem 0;padding:0;line-height:1.45;color:var(--ui-validation-summary-text, #1a1a1a);user-select:none;-webkit-user-select:none}.validation-summary__item:before{content:\"\\2022\";flex-shrink:0;line-height:inherit;color:var(--ui-validation-summary-text, #1a1a1a)}.validation-summary__text{display:inline;font:inherit;user-select:none;-webkit-user-select:none}.validation-summary__link{flex:1;min-width:0;display:block;margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:.12em;cursor:pointer;user-select:none;-webkit-user-select:none}.validation-summary__link:hover{color:var(--ui-validation-summary-link-hover, #0d47a1)}.validation-summary__link:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px;border-radius:4px}.validation-summary__panel--surface-error .validation-summary__link:hover{color:var(--app-color-error, #b91c1c)}.validation-summary__panel.validation-summary__panel--surface-error{background:var(--ui-validation-summary-bg-error, #ffebee);border-color:var(--ui-validation-summary-border-error, #ffcdd2)}.validation-summary__panel--surface-error .validation-summary__title{color:var(--ui-validation-summary-title-error, #b71c1c)}.validation-summary__panel.validation-summary__panel--surface-warning{background:var(--ui-validation-summary-bg-warning, #fff8e1);border-color:var(--ui-validation-summary-border-warning, #ffe082)}.validation-summary__panel--surface-warning .validation-summary__title{color:var(--ui-validation-summary-title-warning, #e65100)}.validation-summary__panel--surface-warning .validation-summary__close,.validation-summary__panel--surface-warning .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}.validation-summary__panel--surface-warning .validation-summary__collapse-toggle:hover{border-color:#e651008c}.validation-summary__panel.validation-summary__panel--surface-info{background:var(--ui-validation-summary-bg-info, #e3f2fd);border-color:var(--ui-validation-summary-border-info, #90caf9)}.validation-summary__panel--surface-info .validation-summary__title{color:var(--ui-validation-summary-title-info, #0d47a1)}.validation-summary__panel--surface-info .validation-summary__close,.validation-summary__panel--surface-info .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}.validation-summary__panel--surface-info .validation-summary__collapse-toggle:hover{border-color:#0d47a18c}.validation-summary__panel--size-compact{padding:.55rem .7rem}.validation-summary__panel--size-compact .validation-summary__head{margin-bottom:.35rem}.validation-summary__panel--size-compact .validation-summary__title{font-size:.92rem}.validation-summary__panel--size-compact .validation-summary__list{padding-left:0}.validation-summary__panel--size-compact .validation-summary__item{font-size:.88rem;margin:.12rem 0}.validation-summary__panel--size-compact .validation-summary__collapse-toggle{width:1.75rem;height:1.75rem;font-size:.72rem}@media(max-width:30rem){.validation-summary__title{font-size:.875rem}.validation-summary__panel--size-compact .validation-summary__title{font-size:.82rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6288
6346
|
}
|
|
6289
6347
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ValidationSummaryComponent, decorators: [{
|
|
6290
6348
|
type: Component,
|
|
6291
|
-
args: [{ selector: 'app-validation-summary', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isShown) {\r\n<div class=\"validation-summary__panel\" role=\"region\"\r\n [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n [class.validation-summary__panel--pinned]=\"pinned\"\r\n [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\">\r\n <div class=\"validation-summary__head\">\r\n @if (showListCollapseToggle) {\r\n <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n </button>\r\n }\r\n @if (summaryHeading.trim()) {\r\n <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n {{ summaryHeading }}\r\n </h3>\r\n }\r\n @if (showCloseButton) {\r\n <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n {{ closeButtonLabel }}\r\n </button>\r\n }\r\n </div>\r\n <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n <ul class=\"validation-summary__list\" role=\"list\">\r\n @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n @if (row.fieldId) {\r\n <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n {{ row.message }}\r\n </button>\r\n } @else {\r\n <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n }\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;scroll-margin-top:.75rem;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none;scroll-margin-top:0}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned,
|
|
6292
|
-
}], propDecorators: {
|
|
6349
|
+
args: [{ selector: 'app-validation-summary', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isShown) {\r\n<div #panelRoot\r\n [attr.id]=\"panelDomId\"\r\n class=\"validation-summary__panel\" role=\"region\"\r\n [attr.aria-labelledby]=\"summaryHeading.trim() ? titleElementId : null\"\r\n [attr.aria-label]=\"summaryHeading.trim() ? null : 'Resumo de valida\u00E7\u00E3o'\"\r\n [class.validation-summary__panel--pinned]=\"pinned\"\r\n [class.validation-summary__panel--pinned-open]=\"pinned && pinnedOpen\"\r\n [class.validation-summary__panel--list-collapsed]=\"!panelBodyExpanded\"\r\n [class.validation-summary__panel--surface-error]=\"variant === 'error'\"\r\n [class.validation-summary__panel--surface-warning]=\"variant === 'warning'\"\r\n [class.validation-summary__panel--surface-info]=\"variant === 'info'\"\r\n [class.validation-summary__panel--size-compact]=\"compact\">\r\n <div class=\"validation-summary__head\">\r\n @if (showListCollapseToggle) {\r\n <button type=\"button\" class=\"validation-summary__collapse-toggle\" (click)=\"toggleListBody()\"\r\n [attr.aria-expanded]=\"panelBodyExpanded\" [attr.aria-controls]=\"listRegionId\"\r\n [attr.aria-label]=\"panelBodyExpanded ? 'Recolher lista de erros' : 'Expandir lista de erros'\">\r\n <i class=\"fa-solid\" aria-hidden=\"true\" [class.fa-chevron-up]=\"panelBodyExpanded\"\r\n [class.fa-chevron-down]=\"!panelBodyExpanded\"></i>\r\n </button>\r\n }\r\n @if (summaryHeading.trim()) {\r\n <h3 class=\"validation-summary__title\" [id]=\"titleElementId\">\r\n {{ summaryHeading }}\r\n </h3>\r\n }\r\n @if (showCloseButton) {\r\n <button type=\"button\" class=\"validation-summary__close\" (click)=\"onCloseClick()\">\r\n {{ closeButtonLabel }}\r\n </button>\r\n }\r\n </div>\r\n <div class=\"validation-summary__list-wrap\" [id]=\"listRegionId\"\r\n [class.validation-summary__list-wrap--scrollable]=\"!!panelMaxHeight && panelBodyExpanded\"\r\n [class.validation-summary__list-wrap--collapsed]=\"!panelBodyExpanded\"\r\n [style.max-height]=\"panelBodyExpanded ? (panelMaxHeight || null) : null\" [attr.title]=\"fieldNavigateHint\">\r\n <ul class=\"validation-summary__list\" role=\"list\">\r\n @for (row of resolvedItems; track itemTrackKey(row, $index)) {\r\n <li class=\"validation-summary__item\" role=\"listitem\" (click)=\"onSummaryLinkActivate($event, row)\">\r\n @if (row.fieldId) {\r\n <button type=\"button\" class=\"validation-summary__link\" [attr.title]=\"fieldNavigateHint\">\r\n {{ row.message }}\r\n </button>\r\n } @else {\r\n <span class=\"validation-summary__text\">{{ row.message }}</span>\r\n }\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n</div>\r\n}", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;scroll-margin-top:.75rem;flex:0 0 auto;align-self:stretch}:host.validation-summary--pinned-host{position:static;display:block;box-sizing:border-box;flex:0 0 auto!important;width:100%;max-width:100%;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible;pointer-events:none;scroll-margin-top:0}.validation-summary__panel.validation-summary__panel--pinned{position:fixed;z-index:var(--app-z-validation-summary-pinned, 10000);isolation:isolate;top:max(.65rem,env(safe-area-inset-top,0px));left:1rem;right:1rem;width:auto;max-width:min(100%,52rem);margin-left:auto;margin-right:auto;box-sizing:border-box;pointer-events:auto;box-shadow:0 4px 6px -1px #00000014,0 10px 24px -6px #0000001f;transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;transition:opacity .2s ease-out}.validation-summary__panel.validation-summary__panel--pinned.validation-summary__panel--pinned-open{opacity:1}.validation-summary__panel{width:100%;border-radius:10px;padding:.85rem 1rem;box-sizing:border-box;border:1px solid transparent}.validation-summary__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.45rem .75rem;margin-bottom:.55rem}.validation-summary__panel--list-collapsed .validation-summary__head{margin-bottom:0}.validation-summary__collapse-toggle{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.8rem;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__collapse-toggle:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__collapse-toggle:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__title{margin:0;flex:1 1 auto;min-width:0;font-size:1rem;font-weight:600;line-height:1.35;user-select:none;-webkit-user-select:none}.validation-summary__close{flex-shrink:0;margin:0 0 0 auto;padding:.3rem .7rem;border:1px solid rgba(183,28,28,.35);border-radius:8px;background:#ffffffbf;color:var(--ui-validation-summary-title-error, #b71c1c);font-size:.85rem;font-weight:500;font-family:inherit;line-height:1.3;cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,border-color .15s ease}.validation-summary__close:hover{background:#fff;border-color:#b71c1c8c}.validation-summary__close:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px}.validation-summary__list-wrap{min-width:0;user-select:none;-webkit-user-select:none;overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin .2s ease}.validation-summary__list-wrap--collapsed{max-height:0!important;opacity:0;margin:0;padding:0;pointer-events:none}.validation-summary__list-wrap--scrollable{overflow-y:auto;overflow-x:hidden;padding-right:.15rem;scrollbar-gutter:stable}.validation-summary__list{margin:0;padding:0;list-style:none}.validation-summary__item{display:flex;align-items:flex-start;gap:.4rem;margin:.2rem 0;padding:0;line-height:1.45;color:var(--ui-validation-summary-text, #1a1a1a);user-select:none;-webkit-user-select:none}.validation-summary__item:before{content:\"\\2022\";flex-shrink:0;line-height:inherit;color:var(--ui-validation-summary-text, #1a1a1a)}.validation-summary__text{display:inline;font:inherit;user-select:none;-webkit-user-select:none}.validation-summary__link{flex:1;min-width:0;display:block;margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:.12em;cursor:pointer;user-select:none;-webkit-user-select:none}.validation-summary__link:hover{color:var(--ui-validation-summary-link-hover, #0d47a1)}.validation-summary__link:focus-visible{outline:2px solid var(--app-color-validation-focus-ring, rgba(185, 28, 28, .45));outline-offset:2px;border-radius:4px}.validation-summary__panel--surface-error .validation-summary__link:hover{color:var(--app-color-error, #b91c1c)}.validation-summary__panel.validation-summary__panel--surface-error{background:var(--ui-validation-summary-bg-error, #ffebee);border-color:var(--ui-validation-summary-border-error, #ffcdd2)}.validation-summary__panel--surface-error .validation-summary__title{color:var(--ui-validation-summary-title-error, #b71c1c)}.validation-summary__panel.validation-summary__panel--surface-warning{background:var(--ui-validation-summary-bg-warning, #fff8e1);border-color:var(--ui-validation-summary-border-warning, #ffe082)}.validation-summary__panel--surface-warning .validation-summary__title{color:var(--ui-validation-summary-title-warning, #e65100)}.validation-summary__panel--surface-warning .validation-summary__close,.validation-summary__panel--surface-warning .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-warning, #e65100);border-color:#e6510059}.validation-summary__panel--surface-warning .validation-summary__collapse-toggle:hover{border-color:#e651008c}.validation-summary__panel.validation-summary__panel--surface-info{background:var(--ui-validation-summary-bg-info, #e3f2fd);border-color:var(--ui-validation-summary-border-info, #90caf9)}.validation-summary__panel--surface-info .validation-summary__title{color:var(--ui-validation-summary-title-info, #0d47a1)}.validation-summary__panel--surface-info .validation-summary__close,.validation-summary__panel--surface-info .validation-summary__collapse-toggle{color:var(--ui-validation-summary-title-info, #0d47a1);border-color:#0d47a159}.validation-summary__panel--surface-info .validation-summary__collapse-toggle:hover{border-color:#0d47a18c}.validation-summary__panel--size-compact{padding:.55rem .7rem}.validation-summary__panel--size-compact .validation-summary__head{margin-bottom:.35rem}.validation-summary__panel--size-compact .validation-summary__title{font-size:.92rem}.validation-summary__panel--size-compact .validation-summary__list{padding-left:0}.validation-summary__panel--size-compact .validation-summary__item{font-size:.88rem;margin:.12rem 0}.validation-summary__panel--size-compact .validation-summary__collapse-toggle{width:1.75rem;height:1.75rem;font-size:.72rem}@media(max-width:30rem){.validation-summary__title{font-size:.875rem}.validation-summary__panel--size-compact .validation-summary__title{font-size:.82rem}}\n"] }]
|
|
6350
|
+
}], propDecorators: { panelRootRef: [{
|
|
6351
|
+
type: ViewChild,
|
|
6352
|
+
args: ['panelRoot', { read: ElementRef }]
|
|
6353
|
+
}], messages: [{
|
|
6293
6354
|
type: Input
|
|
6294
6355
|
}], items: [{
|
|
6295
6356
|
type: Input
|