structra-ui 0.1.98 → 0.1.99
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
CHANGED
|
@@ -5626,7 +5626,7 @@ class ToastHostComponent {
|
|
|
5626
5626
|
this.toastService.runAction(id);
|
|
5627
5627
|
}
|
|
5628
5628
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ToastHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5629
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ToastHostComponent, isStandalone: true, selector: "app-toast-host", ngImport: i0, template: "@if (topToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--top app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of topToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimTop\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (bottomToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--bottom app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of bottomToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimBottom\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [":host{display:contents}.toast-host{position:fixed;right:0;z-index:var(--app-z-toast, 1300);display:flex;align-items:flex-end;gap:.6rem;box-sizing:border-box;pointer-events:none;max-width:100vw}.toast-host--top{top:0;flex-direction:column;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host--bottom{bottom:0;top:auto;flex-direction:column-reverse;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host__item{pointer-events:auto;display:flex;align-items:flex-start;gap:.6rem;width:min(25rem,100vw - 1.7rem);max-width:100%;box-sizing:border-box;border-radius:12px;border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .1));background
|
|
5629
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ToastHostComponent, isStandalone: true, selector: "app-toast-host", ngImport: i0, template: "@if (topToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--top app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of topToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimTop\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (bottomToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--bottom app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of bottomToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimBottom\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [":host{display:contents}.toast-host{position:fixed;right:0;z-index:var(--app-z-toast, 1300);display:flex;align-items:flex-end;gap:.6rem;box-sizing:border-box;pointer-events:none;max-width:100vw}.toast-host--top{top:0;flex-direction:column;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host--bottom{bottom:0;top:auto;flex-direction:column-reverse;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host__item{pointer-events:auto;display:flex;align-items:flex-start;gap:.6rem;width:min(25rem,100vw - 1.7rem);max-width:100%;box-sizing:border-box;border-radius:12px;border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .1));background:#fff;box-shadow:0 4px 8px -2px #0000000f,0 14px 32px -8px #1a2f4524;padding:.85rem .65rem .85rem .95rem;border-left-width:5px;border-left-style:solid}.toast-host__item--success{border-left-color:var(--app-color-success, #15803d)}.toast-host__item--error{border-left-color:var(--app-color-error-border, #dc2626)}.toast-host__item--warning{border-left-color:var(--app-color-warning, #c2410c)}.toast-host__item--info{border-left-color:var(--app-color-primary, #2b7fd9)}.toast-host__body{flex:1 1 auto;min-width:0}.toast-host__title{margin:0 0 .3rem;font-size:.9rem;font-weight:600;line-height:1.35;color:#111827;letter-spacing:.01em}.toast-host__message{margin:0;font-size:.92rem;line-height:1.5;color:#111827;word-break:break-word}.toast-host__action{margin:.5rem 0 0;padding:0;border:none;background:none;font:inherit;font-size:.86rem;font-weight:600;color:#111827;cursor:pointer;text-decoration:underline;text-underline-offset:2px}.toast-host__action:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px;border-radius:4px}.toast-host__close{flex:0 0 auto;width:1.85rem;height:1.85rem;margin:-.05rem 0 0;padding:0;border:1px solid transparent;border-radius:8px;background:transparent;color:#111827;font-size:1.25rem;line-height:1;cursor:pointer}.toast-host__close:hover{background:#11182714;color:#111827}.toast-host__close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
|
|
5630
5630
|
trigger('toastAnimTop', [
|
|
5631
5631
|
transition(':enter', [
|
|
5632
5632
|
style({ opacity: 0, transform: 'translateX(110%)' }),
|
|
@@ -5668,7 +5668,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
5668
5668
|
animate('180ms ease-in', style({ opacity: 0, transform: 'translateY(120%)' })),
|
|
5669
5669
|
]),
|
|
5670
5670
|
]),
|
|
5671
|
-
], template: "@if (topToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--top app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of topToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimTop\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (bottomToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--bottom app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of bottomToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimBottom\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [":host{display:contents}.toast-host{position:fixed;right:0;z-index:var(--app-z-toast, 1300);display:flex;align-items:flex-end;gap:.6rem;box-sizing:border-box;pointer-events:none;max-width:100vw}.toast-host--top{top:0;flex-direction:column;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host--bottom{bottom:0;top:auto;flex-direction:column-reverse;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host__item{pointer-events:auto;display:flex;align-items:flex-start;gap:.6rem;width:min(25rem,100vw - 1.7rem);max-width:100%;box-sizing:border-box;border-radius:12px;border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .1));background
|
|
5671
|
+
], template: "@if (topToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--top app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of topToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimTop\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (bottomToasts().length > 0) {\r\n <div\r\n class=\"toast-host toast-host--bottom app-library-theme\"\r\n [ngClass]=\"theme.getTheme()\"\r\n aria-live=\"polite\"\r\n aria-relevant=\"additions text\"\r\n >\r\n @for (t of bottomToasts(); track t.id) {\r\n <div\r\n [ngClass]=\"['toast-host__item', 'toast-host__item--' + t.type]\"\r\n @toastAnimBottom\r\n role=\"status\"\r\n >\r\n <div class=\"toast-host__body\">\r\n @if (t.title) {\r\n <p class=\"toast-host__title\">{{ t.title }}</p>\r\n }\r\n <p class=\"toast-host__message\">{{ t.message }}</p>\r\n @if (t.actionLabel) {\r\n <button type=\"button\" class=\"toast-host__action\" (click)=\"action(t.id)\">\r\n {{ t.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n <button\r\n type=\"button\"\r\n class=\"toast-host__close\"\r\n [attr.aria-label]=\"'Fechar notifica\u00E7\u00E3o'\"\r\n (click)=\"dismiss(t.id)\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [":host{display:contents}.toast-host{position:fixed;right:0;z-index:var(--app-z-toast, 1300);display:flex;align-items:flex-end;gap:.6rem;box-sizing:border-box;pointer-events:none;max-width:100vw}.toast-host--top{top:0;flex-direction:column;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host--bottom{bottom:0;top:auto;flex-direction:column-reverse;padding:max(.85rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.toast-host__item{pointer-events:auto;display:flex;align-items:flex-start;gap:.6rem;width:min(25rem,100vw - 1.7rem);max-width:100%;box-sizing:border-box;border-radius:12px;border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .1));background:#fff;box-shadow:0 4px 8px -2px #0000000f,0 14px 32px -8px #1a2f4524;padding:.85rem .65rem .85rem .95rem;border-left-width:5px;border-left-style:solid}.toast-host__item--success{border-left-color:var(--app-color-success, #15803d)}.toast-host__item--error{border-left-color:var(--app-color-error-border, #dc2626)}.toast-host__item--warning{border-left-color:var(--app-color-warning, #c2410c)}.toast-host__item--info{border-left-color:var(--app-color-primary, #2b7fd9)}.toast-host__body{flex:1 1 auto;min-width:0}.toast-host__title{margin:0 0 .3rem;font-size:.9rem;font-weight:600;line-height:1.35;color:#111827;letter-spacing:.01em}.toast-host__message{margin:0;font-size:.92rem;line-height:1.5;color:#111827;word-break:break-word}.toast-host__action{margin:.5rem 0 0;padding:0;border:none;background:none;font:inherit;font-size:.86rem;font-weight:600;color:#111827;cursor:pointer;text-decoration:underline;text-underline-offset:2px}.toast-host__action:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px;border-radius:4px}.toast-host__close{flex:0 0 auto;width:1.85rem;height:1.85rem;margin:-.05rem 0 0;padding:0;border:1px solid transparent;border-radius:8px;background:transparent;color:#111827;font-size:1.25rem;line-height:1;cursor:pointer}.toast-host__close:hover{background:#11182714;color:#111827}.toast-host__close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}\n"] }]
|
|
5672
5672
|
}] });
|
|
5673
5673
|
|
|
5674
5674
|
const DEFAULT_MESSAGE = 'A carregar…';
|
|
@@ -7462,31 +7462,74 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
7462
7462
|
args: ['class']
|
|
7463
7463
|
}] } });
|
|
7464
7464
|
|
|
7465
|
+
const FormSectionVariant = {
|
|
7466
|
+
Plain: 'plain',
|
|
7467
|
+
Card: 'card',
|
|
7468
|
+
Panel: 'panel',
|
|
7469
|
+
};
|
|
7470
|
+
const FormSectionAlign = {
|
|
7471
|
+
Start: 'start',
|
|
7472
|
+
Center: 'center',
|
|
7473
|
+
};
|
|
7474
|
+
const FormSectionRadius = {
|
|
7475
|
+
None: 'none',
|
|
7476
|
+
Sm: 'sm',
|
|
7477
|
+
Md: 'md',
|
|
7478
|
+
Lg: 'lg',
|
|
7479
|
+
Xl: 'xl',
|
|
7480
|
+
};
|
|
7465
7481
|
class FormSectionComponent {
|
|
7466
7482
|
constructor() {
|
|
7467
7483
|
this.subtitulo = '';
|
|
7468
7484
|
this.dense = false;
|
|
7469
7485
|
this.divider = false;
|
|
7486
|
+
this.variant = 'plain';
|
|
7487
|
+
this.align = 'start';
|
|
7488
|
+
this.maxWidth = null;
|
|
7489
|
+
this.fullWidth = true;
|
|
7490
|
+
this.radius = 'md';
|
|
7491
|
+
this.elevated = false;
|
|
7470
7492
|
}
|
|
7471
7493
|
get hostClass() {
|
|
7472
7494
|
const parts = ['form-section'];
|
|
7495
|
+
parts.push(`form-section--${this.variant}`);
|
|
7496
|
+
parts.push(`form-section--align-${this.align}`);
|
|
7497
|
+
if (this.usesSurfaceVariant) {
|
|
7498
|
+
parts.push(`form-section--radius-${this.radius}`);
|
|
7499
|
+
}
|
|
7473
7500
|
if (this.dense) {
|
|
7474
7501
|
parts.push('form-section--dense');
|
|
7475
7502
|
}
|
|
7476
7503
|
if (this.divider) {
|
|
7477
7504
|
parts.push('form-section--divider');
|
|
7478
7505
|
}
|
|
7506
|
+
if (!this.fullWidth) {
|
|
7507
|
+
parts.push('form-section--inline');
|
|
7508
|
+
}
|
|
7509
|
+
if (this.usesSurfaceVariant && this.elevated && this.variant === 'card') {
|
|
7510
|
+
parts.push('form-section--elevated');
|
|
7511
|
+
}
|
|
7479
7512
|
return parts.join(' ');
|
|
7480
7513
|
}
|
|
7514
|
+
get hostMaxWidth() {
|
|
7515
|
+
const value = this.maxWidth?.trim();
|
|
7516
|
+
return value ? value : null;
|
|
7517
|
+
}
|
|
7518
|
+
get hostMarginInline() {
|
|
7519
|
+
return this.hostMaxWidth ? 'auto' : null;
|
|
7520
|
+
}
|
|
7521
|
+
get usesSurfaceVariant() {
|
|
7522
|
+
return this.variant === 'card' || this.variant === 'panel';
|
|
7523
|
+
}
|
|
7481
7524
|
get showHeader() {
|
|
7482
7525
|
return this.titulo.trim().length > 0 || this.subtitulo.trim().length > 0;
|
|
7483
7526
|
}
|
|
7484
7527
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7485
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: FormSectionComponent, isStandalone: true, selector: "app-form-section", inputs: { titulo: "titulo", subtitulo: "subtitulo", dense: ["dense", "dense", booleanAttribute], divider: ["divider", "divider", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "@if (showHeader) {\r\n<header class=\"form-section__header\">\r\n @if (titulo.trim()) {\r\n <h2 class=\"form-section__title\">{{ titulo }}</h2>\r\n }\r\n @if (subtitulo.trim()) {\r\n <p class=\"form-section__subtitle\">{{ subtitulo }}</p>\r\n }\r\n</header>\r\n}\r\n<div class=\"form-section__body\">\r\n <ng-content />\r\n</div>", styles: [":host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-section__header{margin:0 0 1.25rem;padding:0}.form-section__title{margin:0 0 .35rem;font-size:1.25rem;font-weight:600;line-height:1.3;color:var(--ui-field-label-color, #1a1a1a)}.form-section__subtitle{margin:0;font-size:.9rem;line-height:1.45;color:#525252}.form-section__body{display:flex;flex-direction:column;gap:1rem;min-width:0}:host.form-section--dense .form-section__header{margin-bottom:.75rem}:host.form-section--dense .form-section__title{font-size:1.1rem}:host.form-section--dense .form-section__body{gap:.65rem}:host.form-section--divider{padding-bottom:1.75rem;margin-bottom:1.75rem;border-bottom:1px solid #e5e5e5}:host.form-section--dense.form-section--divider{padding-bottom:1.25rem;margin-bottom:1.25rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7528
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: FormSectionComponent, isStandalone: true, selector: "app-form-section", inputs: { titulo: "titulo", subtitulo: "subtitulo", dense: ["dense", "dense", booleanAttribute], divider: ["divider", "divider", booleanAttribute], variant: "variant", align: "align", maxWidth: "maxWidth", fullWidth: ["fullWidth", "fullWidth", booleanAttribute], radius: "radius", elevated: ["elevated", "elevated", booleanAttribute] }, host: { properties: { "class": "this.hostClass", "style.max-width": "this.hostMaxWidth", "style.margin-inline": "this.hostMarginInline" } }, ngImport: i0, template: "@if (showHeader) {\r\n<header class=\"form-section__header\">\r\n @if (titulo.trim()) {\r\n <h2 class=\"form-section__title\">{{ titulo }}</h2>\r\n }\r\n @if (subtitulo.trim()) {\r\n <p class=\"form-section__subtitle\">{{ subtitulo }}</p>\r\n }\r\n</header>\r\n}\r\n<div class=\"form-section__content form-section__body\">\r\n <ng-content />\r\n</div>", styles: [":host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-section{width:100%;min-width:0;box-sizing:border-box}.form-section__header{margin:0 0 1.25rem;padding:0}.form-section__title{margin:0 0 .35rem;font-size:1.25rem;font-weight:600;line-height:1.3;color:var(--ui-field-label-color, #1a1a1a)}.form-section__subtitle{margin:0;font-size:.9rem;line-height:1.45;color:#525252}.form-section__content,.form-section__body{display:flex;flex-direction:column;gap:1rem;min-width:0}:host.form-section--align-center .form-section__header{text-align:center}:host.form-section--inline{width:fit-content;max-width:100%}:host.form-section--panel,:host.form-section--card{--form-section-surface-border: var(--app-color-border-subtle, rgba(26, 47, 69, .12));--form-section-surface-bg: var(--app-color-surface, #ffffff);--form-section-surface-shadow: 0 .4rem 1.25rem rgba(15, 23, 42, .08);--form-section-surface-padding-x: 1rem;--form-section-surface-padding-y: 1rem;padding:var(--form-section-surface-padding-y) var(--form-section-surface-padding-x);border:1px solid var(--form-section-surface-border);background:var(--form-section-surface-bg);box-shadow:var(--form-section-surface-shadow)}:host.form-section--panel{--form-section-surface-bg: color-mix( in srgb, var(--app-color-surface, #ffffff) 90%, var(--app-color-background, #f6f7f9) 10% );--form-section-surface-shadow: 0 .15rem .45rem rgba(15, 23, 42, .04)}:host.form-section--card{--form-section-surface-padding-x: 1.25rem;--form-section-surface-padding-y: 1.25rem;--form-section-surface-shadow: 0 .35rem 1rem rgba(15, 23, 42, .06)}:host.form-section--card.form-section--elevated{--form-section-surface-shadow: 0 .8rem 2rem -1.1rem rgba(15, 23, 42, .28)}:host.form-section--radius-none{border-radius:0}:host.form-section--radius-sm{border-radius:var(--radius-sm, 8px)}:host.form-section--radius-md{border-radius:var(--radius-md, 12px)}:host.form-section--radius-lg{border-radius:var(--radius-lg, 16px)}:host.form-section--radius-xl{border-radius:var(--radius-xl, 22px)}:host.form-section--dense .form-section__header{margin-bottom:.75rem}:host.form-section--dense .form-section__title{font-size:1.1rem}:host.form-section--dense .form-section__body{gap:.65rem}:host.form-section--dense.form-section--panel,:host.form-section--dense.form-section--card{--form-section-surface-padding-x: .85rem;--form-section-surface-padding-y: .85rem}:host.form-section--divider{padding-bottom:1.75rem;margin-bottom:1.75rem;border-bottom:1px solid #e5e5e5}:host.form-section--dense.form-section--divider{padding-bottom:1.25rem;margin-bottom:1.25rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7486
7529
|
}
|
|
7487
7530
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormSectionComponent, decorators: [{
|
|
7488
7531
|
type: Component,
|
|
7489
|
-
args: [{ selector: 'app-form-section', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (showHeader) {\r\n<header class=\"form-section__header\">\r\n @if (titulo.trim()) {\r\n <h2 class=\"form-section__title\">{{ titulo }}</h2>\r\n }\r\n @if (subtitulo.trim()) {\r\n <p class=\"form-section__subtitle\">{{ subtitulo }}</p>\r\n }\r\n</header>\r\n}\r\n<div class=\"form-section__body\">\r\n <ng-content />\r\n</div>", styles: [":host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-section__header{margin:0 0 1.25rem;padding:0}.form-section__title{margin:0 0 .35rem;font-size:1.25rem;font-weight:600;line-height:1.3;color:var(--ui-field-label-color, #1a1a1a)}.form-section__subtitle{margin:0;font-size:.9rem;line-height:1.45;color:#525252}.form-section__body{display:flex;flex-direction:column;gap:1rem;min-width:0}:host.form-section--dense .form-section__header{margin-bottom:.75rem}:host.form-section--dense .form-section__title{font-size:1.1rem}:host.form-section--dense .form-section__body{gap:.65rem}:host.form-section--divider{padding-bottom:1.75rem;margin-bottom:1.75rem;border-bottom:1px solid #e5e5e5}:host.form-section--dense.form-section--divider{padding-bottom:1.25rem;margin-bottom:1.25rem}\n"] }]
|
|
7532
|
+
args: [{ selector: 'app-form-section', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (showHeader) {\r\n<header class=\"form-section__header\">\r\n @if (titulo.trim()) {\r\n <h2 class=\"form-section__title\">{{ titulo }}</h2>\r\n }\r\n @if (subtitulo.trim()) {\r\n <p class=\"form-section__subtitle\">{{ subtitulo }}</p>\r\n }\r\n</header>\r\n}\r\n<div class=\"form-section__content form-section__body\">\r\n <ng-content />\r\n</div>", styles: [":host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-section{width:100%;min-width:0;box-sizing:border-box}.form-section__header{margin:0 0 1.25rem;padding:0}.form-section__title{margin:0 0 .35rem;font-size:1.25rem;font-weight:600;line-height:1.3;color:var(--ui-field-label-color, #1a1a1a)}.form-section__subtitle{margin:0;font-size:.9rem;line-height:1.45;color:#525252}.form-section__content,.form-section__body{display:flex;flex-direction:column;gap:1rem;min-width:0}:host.form-section--align-center .form-section__header{text-align:center}:host.form-section--inline{width:fit-content;max-width:100%}:host.form-section--panel,:host.form-section--card{--form-section-surface-border: var(--app-color-border-subtle, rgba(26, 47, 69, .12));--form-section-surface-bg: var(--app-color-surface, #ffffff);--form-section-surface-shadow: 0 .4rem 1.25rem rgba(15, 23, 42, .08);--form-section-surface-padding-x: 1rem;--form-section-surface-padding-y: 1rem;padding:var(--form-section-surface-padding-y) var(--form-section-surface-padding-x);border:1px solid var(--form-section-surface-border);background:var(--form-section-surface-bg);box-shadow:var(--form-section-surface-shadow)}:host.form-section--panel{--form-section-surface-bg: color-mix( in srgb, var(--app-color-surface, #ffffff) 90%, var(--app-color-background, #f6f7f9) 10% );--form-section-surface-shadow: 0 .15rem .45rem rgba(15, 23, 42, .04)}:host.form-section--card{--form-section-surface-padding-x: 1.25rem;--form-section-surface-padding-y: 1.25rem;--form-section-surface-shadow: 0 .35rem 1rem rgba(15, 23, 42, .06)}:host.form-section--card.form-section--elevated{--form-section-surface-shadow: 0 .8rem 2rem -1.1rem rgba(15, 23, 42, .28)}:host.form-section--radius-none{border-radius:0}:host.form-section--radius-sm{border-radius:var(--radius-sm, 8px)}:host.form-section--radius-md{border-radius:var(--radius-md, 12px)}:host.form-section--radius-lg{border-radius:var(--radius-lg, 16px)}:host.form-section--radius-xl{border-radius:var(--radius-xl, 22px)}:host.form-section--dense .form-section__header{margin-bottom:.75rem}:host.form-section--dense .form-section__title{font-size:1.1rem}:host.form-section--dense .form-section__body{gap:.65rem}:host.form-section--dense.form-section--panel,:host.form-section--dense.form-section--card{--form-section-surface-padding-x: .85rem;--form-section-surface-padding-y: .85rem}:host.form-section--divider{padding-bottom:1.75rem;margin-bottom:1.75rem;border-bottom:1px solid #e5e5e5}:host.form-section--dense.form-section--divider{padding-bottom:1.25rem;margin-bottom:1.25rem}\n"] }]
|
|
7490
7533
|
}], propDecorators: { titulo: [{
|
|
7491
7534
|
type: Input,
|
|
7492
7535
|
args: [{ required: true }]
|
|
@@ -7498,9 +7541,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
7498
7541
|
}], divider: [{
|
|
7499
7542
|
type: Input,
|
|
7500
7543
|
args: [{ transform: booleanAttribute }]
|
|
7544
|
+
}], variant: [{
|
|
7545
|
+
type: Input
|
|
7546
|
+
}], align: [{
|
|
7547
|
+
type: Input
|
|
7548
|
+
}], maxWidth: [{
|
|
7549
|
+
type: Input
|
|
7550
|
+
}], fullWidth: [{
|
|
7551
|
+
type: Input,
|
|
7552
|
+
args: [{ transform: booleanAttribute }]
|
|
7553
|
+
}], radius: [{
|
|
7554
|
+
type: Input
|
|
7555
|
+
}], elevated: [{
|
|
7556
|
+
type: Input,
|
|
7557
|
+
args: [{ transform: booleanAttribute }]
|
|
7501
7558
|
}], hostClass: [{
|
|
7502
7559
|
type: HostBinding,
|
|
7503
7560
|
args: ['class']
|
|
7561
|
+
}], hostMaxWidth: [{
|
|
7562
|
+
type: HostBinding,
|
|
7563
|
+
args: ['style.max-width']
|
|
7564
|
+
}], hostMarginInline: [{
|
|
7565
|
+
type: HostBinding,
|
|
7566
|
+
args: ['style.margin-inline']
|
|
7504
7567
|
}] } });
|
|
7505
7568
|
|
|
7506
7569
|
/** Evento no host `app-form-group`: expandir grupo sem scroll próprio (navegação a partir do resumo). */
|
|
@@ -10343,5 +10406,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
10343
10406
|
* Generated bundle index. Do not edit.
|
|
10344
10407
|
*/
|
|
10345
10408
|
|
|
10346
|
-
export { ADAPTIVE_DATA_VIEW_MOBILE_QUERY, APP_SIDEBAR_LABEL_REVEAL_LAG_MS, APP_SIDEBAR_LAYOUT_DURATION_MS, APP_SIDEBAR_NAV_REVEAL_TOTAL_MS, APP_THEME_BASE_CLASS, APP_THEME_IDS, ActionMenuComponent, AdaptiveDataViewComponent, AnchoredOverlayComponent, AppBreadcrumbComponent, AppDialogComponent, AppLibLightBlockScrollStrategy, AppShellComponent, AppShellSidebarTemplateDirective, AppShellSidebarToggleComponent, AppSidebarComponent, AppSidebarToolbarDirective, AppTheme, AppThemeService, AppTopbarComponent, AppUserMenuComponent, BR_ESTADOS_NOME_SIGLA, BaseFieldComponent, BaseFieldDirective, BooleanFieldDirective, ButtonComponent, ButtonRadius, ButtonSize, ButtonType, ButtonVariant, CardListComponent, CepFieldComponent, CheckboxFieldComponent, ConfirmDialogComponent, ConfirmDialogService, ContextMenuComponent, CpfCnpjFieldComponent, DashboardSectionComponent, DataCardComponent, DataGridComponent, DataListComponent, DataToolbarComponent, DateFieldComponent, DecimalFieldComponent, DetailsFieldComponent, DetailsViewComponent, DialogFooterDirective, DividerComponent, DrawerComponent, DrawerSide, DrawerSize, DropdownBaseComponent, DropdownMenuComponent, DropdownMultiOptionFieldBase, DropdownOptionFieldBase, DropdownSearchFieldComponent, EmptyStateComponent, FILE_PREVIEW_UNAVAILABLE_MESSAGE, FileUploadFieldComponent, FormActionsAlign, FormActionsComponent, FormColComponent, FormGroupComponent, FormGroupVariant, FormLayoutGap, FormRowAlign, FormRowComponent, FormRowJustify, FormSectionComponent, FormTabComponent, FormTabsComponent, ImagePreviewPanelComponent, InputMaskFieldComponent, IntegerFieldComponent, LAYOUT_STACK_SIDE_BY_SIDE, LAYOUT_STACK_STACKED, LayoutStackAlign, LayoutStackComponent, LayoutStackDirection, LayoutStackItemAlign, LibDialogSize, ListItemComponent, LoadingDialogComponent, LoadingDialogService, MaskedTextFieldBase, MenuDividerComponent, MenuDropdownPlacement, MenuGroupComponent, MenuListComponent, MultiselectFieldComponent, NgControlFieldDirective, OverlayPlacement, PDF_IFRAME_VIEWER_HASH, PasswordFieldComponent, PhoneFieldComponent, PopoverBodyTemplateDirective, PopoverComponent, PopoverFooterTemplateDirective, PopoverTriggerDirective, STRUCTRA_THEME_IDS, STRUCTRA_UI, SelectFieldComponent, SkeletonBlockComponent, SkeletonCardComponent, SkeletonFieldShellComponent, SkeletonListComponent, SkeletonTableComponent, SkeletonTextComponent, StatCardComponent, StatusBadgeComponent, SwitchFieldComponent, TableEmptyStateComponent, TableToolbarComponent, TextFieldComponent, TextareaFieldComponent, ThemeDirective, ToastHostComponent, ToastService, TooltipComponent, TooltipPanelTemplateDirective, ValidationSummaryComponent, anchoredOverlayPositions, appendPdfIframeViewerParams, applyPickedCalendarDate, buildDecimalBrDisplay, buildDecimalBrParseString, buildEmptyStateOverlayHtml, caretIndexFromIntegerDigitCount, caretIndexFromSemantic, cepMaskCompleteValidator, cpfCnpjMaskCompleteValidator, escapeHtml, extractDecimalBrParts, fileIsLikelyImage, fileMatchesAccept, fixedDigitsMaskCompleteValidator, formatAcceptForDisplay, formatDateTimePtBr, formatDecimalBr, formatFileSizeBytes, formatIntegerThousandsBr, formatMaskDigits, formatUiFieldDateValue, getFilePreviewKind, getThemeClass, getThemeClassList, getThemeTokenClass, libDialogPanelClasses, mapEstadosToOptions, maskDigitCount, normalizeFormDateValue, normalizeStructraTheme, parseDecimalBr, parseIntegerString, parseUiFieldDateValue, phoneBrMaskCompleteValidator, resolveControlAtPath, sanitizeDecimalBrInput, sanitizeIntegerDigits, sectionHasVisibleInvalid, semanticCaretAt, semanticIntegerDigitCountLeft, stripToDigits, subscribeMarkForCheckOnInvalidUiRefresh, subtreeHasVisibleInvalid };
|
|
10409
|
+
export { ADAPTIVE_DATA_VIEW_MOBILE_QUERY, APP_SIDEBAR_LABEL_REVEAL_LAG_MS, APP_SIDEBAR_LAYOUT_DURATION_MS, APP_SIDEBAR_NAV_REVEAL_TOTAL_MS, APP_THEME_BASE_CLASS, APP_THEME_IDS, ActionMenuComponent, AdaptiveDataViewComponent, AnchoredOverlayComponent, AppBreadcrumbComponent, AppDialogComponent, AppLibLightBlockScrollStrategy, AppShellComponent, AppShellSidebarTemplateDirective, AppShellSidebarToggleComponent, AppSidebarComponent, AppSidebarToolbarDirective, AppTheme, AppThemeService, AppTopbarComponent, AppUserMenuComponent, BR_ESTADOS_NOME_SIGLA, BaseFieldComponent, BaseFieldDirective, BooleanFieldDirective, ButtonComponent, ButtonRadius, ButtonSize, ButtonType, ButtonVariant, CardListComponent, CepFieldComponent, CheckboxFieldComponent, ConfirmDialogComponent, ConfirmDialogService, ContextMenuComponent, CpfCnpjFieldComponent, DashboardSectionComponent, DataCardComponent, DataGridComponent, DataListComponent, DataToolbarComponent, DateFieldComponent, DecimalFieldComponent, DetailsFieldComponent, DetailsViewComponent, DialogFooterDirective, DividerComponent, DrawerComponent, DrawerSide, DrawerSize, DropdownBaseComponent, DropdownMenuComponent, DropdownMultiOptionFieldBase, DropdownOptionFieldBase, DropdownSearchFieldComponent, EmptyStateComponent, FILE_PREVIEW_UNAVAILABLE_MESSAGE, FileUploadFieldComponent, FormActionsAlign, FormActionsComponent, FormColComponent, FormGroupComponent, FormGroupVariant, FormLayoutGap, FormRowAlign, FormRowComponent, FormRowJustify, FormSectionAlign, FormSectionComponent, FormSectionRadius, FormSectionVariant, FormTabComponent, FormTabsComponent, ImagePreviewPanelComponent, InputMaskFieldComponent, IntegerFieldComponent, LAYOUT_STACK_SIDE_BY_SIDE, LAYOUT_STACK_STACKED, LayoutStackAlign, LayoutStackComponent, LayoutStackDirection, LayoutStackItemAlign, LibDialogSize, ListItemComponent, LoadingDialogComponent, LoadingDialogService, MaskedTextFieldBase, MenuDividerComponent, MenuDropdownPlacement, MenuGroupComponent, MenuListComponent, MultiselectFieldComponent, NgControlFieldDirective, OverlayPlacement, PDF_IFRAME_VIEWER_HASH, PasswordFieldComponent, PhoneFieldComponent, PopoverBodyTemplateDirective, PopoverComponent, PopoverFooterTemplateDirective, PopoverTriggerDirective, STRUCTRA_THEME_IDS, STRUCTRA_UI, SelectFieldComponent, SkeletonBlockComponent, SkeletonCardComponent, SkeletonFieldShellComponent, SkeletonListComponent, SkeletonTableComponent, SkeletonTextComponent, StatCardComponent, StatusBadgeComponent, SwitchFieldComponent, TableEmptyStateComponent, TableToolbarComponent, TextFieldComponent, TextareaFieldComponent, ThemeDirective, ToastHostComponent, ToastService, TooltipComponent, TooltipPanelTemplateDirective, ValidationSummaryComponent, anchoredOverlayPositions, appendPdfIframeViewerParams, applyPickedCalendarDate, buildDecimalBrDisplay, buildDecimalBrParseString, buildEmptyStateOverlayHtml, caretIndexFromIntegerDigitCount, caretIndexFromSemantic, cepMaskCompleteValidator, cpfCnpjMaskCompleteValidator, escapeHtml, extractDecimalBrParts, fileIsLikelyImage, fileMatchesAccept, fixedDigitsMaskCompleteValidator, formatAcceptForDisplay, formatDateTimePtBr, formatDecimalBr, formatFileSizeBytes, formatIntegerThousandsBr, formatMaskDigits, formatUiFieldDateValue, getFilePreviewKind, getThemeClass, getThemeClassList, getThemeTokenClass, libDialogPanelClasses, mapEstadosToOptions, maskDigitCount, normalizeFormDateValue, normalizeStructraTheme, parseDecimalBr, parseIntegerString, parseUiFieldDateValue, phoneBrMaskCompleteValidator, resolveControlAtPath, sanitizeDecimalBrInput, sanitizeIntegerDigits, sectionHasVisibleInvalid, semanticCaretAt, semanticIntegerDigitCountLeft, stripToDigits, subscribeMarkForCheckOnInvalidUiRefresh, subtreeHasVisibleInvalid };
|
|
10347
10410
|
//# sourceMappingURL=structra-ui.mjs.map
|