structra-ui 0.1.6 → 0.1.8
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/app/_utils/scroll/body-scroll-lock.util.d.ts +22 -0
- package/app/dialogs/_utils/app-lib-light-block-scroll-strategy.d.ts +12 -0
- package/app/dialogs/app-dialog/app-dialog.component.d.ts +2 -1
- package/app/dialogs/index.d.ts +1 -0
- package/esm2022/app/_utils/scroll/body-scroll-lock.util.mjs +55 -1
- package/esm2022/app/dialogs/_utils/app-lib-light-block-scroll-strategy.mjs +22 -0
- package/esm2022/app/dialogs/app-dialog/app-dialog.component.mjs +11 -11
- package/esm2022/app/dialogs/confirm-dialog/confirm-dialog.service.mjs +3 -1
- package/esm2022/app/dialogs/index.mjs +2 -1
- package/esm2022/app/dialogs/loading-dialog/loading-dialog.service.mjs +3 -1
- package/fesm2022/structra-ui.mjs +87 -10
- package/fesm2022/structra-ui.mjs.map +1 -1
- package/package.json +1 -1
package/fesm2022/structra-ui.mjs
CHANGED
|
@@ -7283,6 +7283,60 @@ function unlockPageScrollCdkStyle(s) {
|
|
|
7283
7283
|
body.style.touchAction = s.bodyTouchAction;
|
|
7284
7284
|
window.scroll(s.scrollX, s.scrollY);
|
|
7285
7285
|
}
|
|
7286
|
+
let appDialogLightLockDepth = 0;
|
|
7287
|
+
let appDialogLightLockSnapshot = null;
|
|
7288
|
+
function applyAppDialogScrollLock() {
|
|
7289
|
+
const html = document.documentElement;
|
|
7290
|
+
const body = document.body;
|
|
7291
|
+
const scrollX = window.scrollX ?? html.scrollLeft;
|
|
7292
|
+
const scrollY = window.scrollY ?? html.scrollTop;
|
|
7293
|
+
return {
|
|
7294
|
+
scrollX,
|
|
7295
|
+
scrollY,
|
|
7296
|
+
htmlOverflow: html.style.overflow,
|
|
7297
|
+
bodyOverflow: body.style.overflow,
|
|
7298
|
+
bodyTouchAction: body.style.touchAction,
|
|
7299
|
+
};
|
|
7300
|
+
}
|
|
7301
|
+
function installAppDialogScrollLockStyles(s) {
|
|
7302
|
+
const html = document.documentElement;
|
|
7303
|
+
const body = document.body;
|
|
7304
|
+
html.classList.add('app-dialog-scroll-lock');
|
|
7305
|
+
html.style.overflow = 'hidden';
|
|
7306
|
+
body.style.overflow = 'hidden';
|
|
7307
|
+
body.style.touchAction = 'none';
|
|
7308
|
+
}
|
|
7309
|
+
function restoreAppDialogScrollLock(s) {
|
|
7310
|
+
const html = document.documentElement;
|
|
7311
|
+
const body = document.body;
|
|
7312
|
+
html.classList.remove('app-dialog-scroll-lock');
|
|
7313
|
+
html.style.overflow = s.htmlOverflow;
|
|
7314
|
+
body.style.overflow = s.bodyOverflow;
|
|
7315
|
+
body.style.touchAction = s.bodyTouchAction;
|
|
7316
|
+
window.scroll(s.scrollX, s.scrollY);
|
|
7317
|
+
}
|
|
7318
|
+
/**
|
|
7319
|
+
* Incrementa um contador de aninhamento: o primeiro lock aplica o DOM; locks interiores
|
|
7320
|
+
* (ex.: `app-dialog` + CDK Dialog) só incrementam a profundidade.
|
|
7321
|
+
*/
|
|
7322
|
+
function lockPageScrollAppDialog() {
|
|
7323
|
+
if (appDialogLightLockDepth === 0) {
|
|
7324
|
+
appDialogLightLockSnapshot = applyAppDialogScrollLock();
|
|
7325
|
+
installAppDialogScrollLockStyles(appDialogLightLockSnapshot);
|
|
7326
|
+
}
|
|
7327
|
+
appDialogLightLockDepth++;
|
|
7328
|
+
return appDialogLightLockSnapshot;
|
|
7329
|
+
}
|
|
7330
|
+
/** Par com {@link lockPageScrollAppDialog}; o snapshot pode ser ignorado — usa-se a pilha interna. */
|
|
7331
|
+
function unlockPageScrollAppDialog(_s) {
|
|
7332
|
+
if (appDialogLightLockDepth > 0) {
|
|
7333
|
+
appDialogLightLockDepth--;
|
|
7334
|
+
}
|
|
7335
|
+
if (appDialogLightLockDepth === 0 && appDialogLightLockSnapshot !== null) {
|
|
7336
|
+
restoreAppDialogScrollLock(appDialogLightLockSnapshot);
|
|
7337
|
+
appDialogLightLockSnapshot = null;
|
|
7338
|
+
}
|
|
7339
|
+
}
|
|
7286
7340
|
|
|
7287
7341
|
/** Largura máxima do painel `app-dialog` (conteúdo responsivo). */
|
|
7288
7342
|
var LibDialogSize;
|
|
@@ -7295,7 +7349,8 @@ var LibDialogSize;
|
|
|
7295
7349
|
let appDialogSeq = 0;
|
|
7296
7350
|
/**
|
|
7297
7351
|
* Diálogo modal declarativo com `[(open)]`, projeção de corpo e rodapé opcional (`[appDialogFooter]`).
|
|
7298
|
-
* Bloqueio de scroll
|
|
7352
|
+
* Bloqueio de scroll com {@link lockPageScrollAppDialog} (sem deslocar o `html` como o CDK),
|
|
7353
|
+
* para o scrim `position: fixed` alinhar ao viewport em páginas com scroll no `body`.
|
|
7299
7354
|
*/
|
|
7300
7355
|
class AppDialogComponent {
|
|
7301
7356
|
constructor() {
|
|
@@ -7334,8 +7389,7 @@ class AppDialogComponent {
|
|
|
7334
7389
|
this.bodyRestoreNext = null;
|
|
7335
7390
|
this.previousActive = null;
|
|
7336
7391
|
this.scrollLock = {
|
|
7337
|
-
|
|
7338
|
-
htmlTop: '',
|
|
7392
|
+
htmlOverflow: '',
|
|
7339
7393
|
scrollX: 0,
|
|
7340
7394
|
scrollY: 0,
|
|
7341
7395
|
bodyOverflow: '',
|
|
@@ -7350,10 +7404,10 @@ class AppDialogComponent {
|
|
|
7350
7404
|
if (a instanceof HTMLElement && a !== document.body) {
|
|
7351
7405
|
this.previousActive = a;
|
|
7352
7406
|
}
|
|
7353
|
-
this.scrollLock =
|
|
7407
|
+
this.scrollLock = lockPageScrollAppDialog();
|
|
7354
7408
|
}
|
|
7355
7409
|
else {
|
|
7356
|
-
|
|
7410
|
+
unlockPageScrollAppDialog(this.scrollLock);
|
|
7357
7411
|
this.detachHostFromBody();
|
|
7358
7412
|
this.restoreFocus();
|
|
7359
7413
|
}
|
|
@@ -7361,7 +7415,7 @@ class AppDialogComponent {
|
|
|
7361
7415
|
}
|
|
7362
7416
|
ngOnDestroy() {
|
|
7363
7417
|
if (this.open) {
|
|
7364
|
-
|
|
7418
|
+
unlockPageScrollAppDialog(this.scrollLock);
|
|
7365
7419
|
}
|
|
7366
7420
|
this.detachHostFromBody();
|
|
7367
7421
|
}
|
|
@@ -7417,7 +7471,7 @@ class AppDialogComponent {
|
|
|
7417
7471
|
}
|
|
7418
7472
|
this.open = false;
|
|
7419
7473
|
this.openChange.emit(false);
|
|
7420
|
-
|
|
7474
|
+
unlockPageScrollAppDialog(this.scrollLock);
|
|
7421
7475
|
this.restoreFocus();
|
|
7422
7476
|
}
|
|
7423
7477
|
restoreFocus() {
|
|
@@ -7427,11 +7481,11 @@ class AppDialogComponent {
|
|
|
7427
7481
|
this.previousActive = null;
|
|
7428
7482
|
}
|
|
7429
7483
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AppDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7430
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AppDialogComponent, isStandalone: true, selector: "app-dialog", inputs: { open: ["open", "open", booleanAttribute], dialogHeading: ["title", "dialogHeading"], description: "description", ariaLabel: "ariaLabel", size: "size", allowOverlayDismiss: ["allowOverlayDismiss", "allowOverlayDismiss", booleanAttribute], showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute] }, outputs: { openChange: "openChange" }, host: { listeners: { "document:keydown": "onDocumentKeydown($event)" } }, usesOnChanges: true, ngImport: i0, template: "@if (open) {\r\n <div\r\n class=\"app-dialog-backdrop\"\r\n role=\"presentation\"\r\n tabindex=\"-1\"\r\n (click)=\"onBackdropClick()\"\r\n ></div>\r\n <div class=\"app-dialog-stage\" aria-hidden=\"false\">\r\n <div\r\n class=\"app-dialog-panel\"\r\n [class.app-dialog-panel--sm]=\"size === LibDialogSize.Sm\"\r\n [class.app-dialog-panel--md]=\"size === LibDialogSize.Md\"\r\n [class.app-dialog-panel--lg]=\"size === LibDialogSize.Lg\"\r\n role=\"dialog\"\r\n aria-modal=\"true\"\r\n [attr.aria-labelledby]=\"\r\n dialogHeading.trim() ? titleId : description.trim() ? descriptionId : null\r\n \"\r\n [attr.aria-label]=\"!dialogHeading.trim() && !description.trim() ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"\r\n dialogHeading.trim() && description.trim() ? descriptionId : null\r\n \"\r\n cdkTrapFocus\r\n [cdkTrapFocusAutoCapture]=\"true\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n @if (dialogHeading.trim()) {\r\n <header class=\"app-dialog-header\">\r\n <h2 class=\"app-dialog-title\" [id]=\"titleId\">{{ dialogHeading }}</h2>\r\n @if (showCloseButton) {\r\n <button\r\n type=\"button\"\r\n class=\"app-dialog-close\"\r\n aria-label=\"Fechar di\u00E1logo\"\r\n (click)=\"requestClose()\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n }\r\n </header>\r\n }\r\n @if (description.trim()) {\r\n <p class=\"app-dialog-description\" [id]=\"descriptionId\">{{ description }}</p>\r\n }\r\n <div class=\"app-dialog-body\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"app-dialog-footer\">\r\n <ng-content select=\"[appDialogFooter]\" />\r\n </footer>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-dialog-backdrop{position:fixed;inset:0;z-index:var(--app-z-dialog, 1200);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);pointer-events:auto
|
|
7484
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AppDialogComponent, isStandalone: true, selector: "app-dialog", inputs: { open: ["open", "open", booleanAttribute], dialogHeading: ["title", "dialogHeading"], description: "description", ariaLabel: "ariaLabel", size: "size", allowOverlayDismiss: ["allowOverlayDismiss", "allowOverlayDismiss", booleanAttribute], showCloseButton: ["showCloseButton", "showCloseButton", booleanAttribute] }, outputs: { openChange: "openChange" }, host: { listeners: { "document:keydown": "onDocumentKeydown($event)" } }, usesOnChanges: true, ngImport: i0, template: "@if (open) {\r\n <div\r\n class=\"app-dialog-backdrop\"\r\n role=\"presentation\"\r\n tabindex=\"-1\"\r\n (click)=\"onBackdropClick()\"\r\n ></div>\r\n <div class=\"app-dialog-stage\" aria-hidden=\"false\">\r\n <div\r\n class=\"app-dialog-panel\"\r\n [class.app-dialog-panel--sm]=\"size === LibDialogSize.Sm\"\r\n [class.app-dialog-panel--md]=\"size === LibDialogSize.Md\"\r\n [class.app-dialog-panel--lg]=\"size === LibDialogSize.Lg\"\r\n role=\"dialog\"\r\n aria-modal=\"true\"\r\n [attr.aria-labelledby]=\"\r\n dialogHeading.trim() ? titleId : description.trim() ? descriptionId : null\r\n \"\r\n [attr.aria-label]=\"!dialogHeading.trim() && !description.trim() ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"\r\n dialogHeading.trim() && description.trim() ? descriptionId : null\r\n \"\r\n cdkTrapFocus\r\n [cdkTrapFocusAutoCapture]=\"true\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n @if (dialogHeading.trim()) {\r\n <header class=\"app-dialog-header\">\r\n <h2 class=\"app-dialog-title\" [id]=\"titleId\">{{ dialogHeading }}</h2>\r\n @if (showCloseButton) {\r\n <button\r\n type=\"button\"\r\n class=\"app-dialog-close\"\r\n aria-label=\"Fechar di\u00E1logo\"\r\n (click)=\"requestClose()\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n }\r\n </header>\r\n }\r\n @if (description.trim()) {\r\n <p class=\"app-dialog-description\" [id]=\"descriptionId\">{{ description }}</p>\r\n }\r\n <div class=\"app-dialog-body\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"app-dialog-footer\">\r\n <ng-content select=\"[appDialogFooter]\" />\r\n </footer>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-dialog-backdrop{position:fixed;inset:0;z-index:var(--app-z-dialog, 1200);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);pointer-events:auto}.app-dialog-stage{position:fixed;inset:0;z-index:calc(var(--app-z-dialog, 1200) + 1);display:flex;align-items:center;justify-content:center;padding:min(1.5rem,4vw);box-sizing:border-box;pointer-events:none;background:transparent}.app-dialog-panel{position:relative;z-index:0;display:flex;flex-direction:column;max-height:min(88vh,40rem);width:100%;pointer-events:auto;overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;box-sizing:border-box;border-radius:10px;border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .12));background:var(--app-color-surface, #fff);box-shadow:0 4px 6px -1px #00000014,0 12px 28px -8px #1a2f452e;outline:none;animation:app-lib-dialog-panel-in .28s cubic-bezier(.22,1,.36,1) both}.app-dialog-panel--sm{max-width:min(28rem,94vw)}.app-dialog-panel--md{max-width:min(40rem,94vw)}.app-dialog-panel--lg{max-width:min(56rem,96vw)}@media (prefers-reduced-motion: reduce){.app-dialog-panel{animation:none}}.app-dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:1rem 1rem .65rem;border-bottom:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));flex:0 0 auto}.app-dialog-title{margin:0;font-size:1.05rem;font-weight:600;line-height:1.3;color:var(--app-color-text-primary, #1a2f45)}.app-dialog-description{margin:0;padding:.65rem 1rem;font-size:.88rem;line-height:1.45;color:var(--app-color-text-secondary, #5a7fa3);flex:0 0 auto}.app-dialog-close{flex:0 0 auto;width:2rem;height:2rem;margin:0;padding:0;border:1px solid var(--app-color-border, #d4d4d4);border-radius:6px;background:var(--app-color-surface-alt, #fff);color:var(--app-color-text-secondary, #5a7fa3);font-size:1.35rem;line-height:1;cursor:pointer}.app-dialog-close:hover{background:var(--app-color-hover-bg, rgba(43, 127, 217, .08))}.app-dialog-close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}.app-dialog-body{padding:1rem;flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;font-size:.9rem;line-height:1.5;color:var(--app-color-text-primary, #1a2f45)}.app-dialog-footer{flex:0 0 auto;padding:.65rem 1rem 1rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}.app-dialog-footer:empty{display:none;padding:0;border:none}\n"], dependencies: [{ kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7431
7485
|
}
|
|
7432
7486
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AppDialogComponent, decorators: [{
|
|
7433
7487
|
type: Component,
|
|
7434
|
-
args: [{ selector: 'app-dialog', standalone: true, imports: [CdkTrapFocus], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (open) {\r\n <div\r\n class=\"app-dialog-backdrop\"\r\n role=\"presentation\"\r\n tabindex=\"-1\"\r\n (click)=\"onBackdropClick()\"\r\n ></div>\r\n <div class=\"app-dialog-stage\" aria-hidden=\"false\">\r\n <div\r\n class=\"app-dialog-panel\"\r\n [class.app-dialog-panel--sm]=\"size === LibDialogSize.Sm\"\r\n [class.app-dialog-panel--md]=\"size === LibDialogSize.Md\"\r\n [class.app-dialog-panel--lg]=\"size === LibDialogSize.Lg\"\r\n role=\"dialog\"\r\n aria-modal=\"true\"\r\n [attr.aria-labelledby]=\"\r\n dialogHeading.trim() ? titleId : description.trim() ? descriptionId : null\r\n \"\r\n [attr.aria-label]=\"!dialogHeading.trim() && !description.trim() ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"\r\n dialogHeading.trim() && description.trim() ? descriptionId : null\r\n \"\r\n cdkTrapFocus\r\n [cdkTrapFocusAutoCapture]=\"true\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n @if (dialogHeading.trim()) {\r\n <header class=\"app-dialog-header\">\r\n <h2 class=\"app-dialog-title\" [id]=\"titleId\">{{ dialogHeading }}</h2>\r\n @if (showCloseButton) {\r\n <button\r\n type=\"button\"\r\n class=\"app-dialog-close\"\r\n aria-label=\"Fechar di\u00E1logo\"\r\n (click)=\"requestClose()\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n }\r\n </header>\r\n }\r\n @if (description.trim()) {\r\n <p class=\"app-dialog-description\" [id]=\"descriptionId\">{{ description }}</p>\r\n }\r\n <div class=\"app-dialog-body\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"app-dialog-footer\">\r\n <ng-content select=\"[appDialogFooter]\" />\r\n </footer>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-dialog-backdrop{position:fixed;inset:0;z-index:var(--app-z-dialog, 1200);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);pointer-events:auto
|
|
7488
|
+
args: [{ selector: 'app-dialog', standalone: true, imports: [CdkTrapFocus], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (open) {\r\n <div\r\n class=\"app-dialog-backdrop\"\r\n role=\"presentation\"\r\n tabindex=\"-1\"\r\n (click)=\"onBackdropClick()\"\r\n ></div>\r\n <div class=\"app-dialog-stage\" aria-hidden=\"false\">\r\n <div\r\n class=\"app-dialog-panel\"\r\n [class.app-dialog-panel--sm]=\"size === LibDialogSize.Sm\"\r\n [class.app-dialog-panel--md]=\"size === LibDialogSize.Md\"\r\n [class.app-dialog-panel--lg]=\"size === LibDialogSize.Lg\"\r\n role=\"dialog\"\r\n aria-modal=\"true\"\r\n [attr.aria-labelledby]=\"\r\n dialogHeading.trim() ? titleId : description.trim() ? descriptionId : null\r\n \"\r\n [attr.aria-label]=\"!dialogHeading.trim() && !description.trim() ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"\r\n dialogHeading.trim() && description.trim() ? descriptionId : null\r\n \"\r\n cdkTrapFocus\r\n [cdkTrapFocusAutoCapture]=\"true\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n @if (dialogHeading.trim()) {\r\n <header class=\"app-dialog-header\">\r\n <h2 class=\"app-dialog-title\" [id]=\"titleId\">{{ dialogHeading }}</h2>\r\n @if (showCloseButton) {\r\n <button\r\n type=\"button\"\r\n class=\"app-dialog-close\"\r\n aria-label=\"Fechar di\u00E1logo\"\r\n (click)=\"requestClose()\"\r\n >\r\n <span aria-hidden=\"true\">×</span>\r\n </button>\r\n }\r\n </header>\r\n }\r\n @if (description.trim()) {\r\n <p class=\"app-dialog-description\" [id]=\"descriptionId\">{{ description }}</p>\r\n }\r\n <div class=\"app-dialog-body\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"app-dialog-footer\">\r\n <ng-content select=\"[appDialogFooter]\" />\r\n </footer>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.app-dialog-backdrop{position:fixed;inset:0;z-index:var(--app-z-dialog, 1200);background:#1a2f456b;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);pointer-events:auto}.app-dialog-stage{position:fixed;inset:0;z-index:calc(var(--app-z-dialog, 1200) + 1);display:flex;align-items:center;justify-content:center;padding:min(1.5rem,4vw);box-sizing:border-box;pointer-events:none;background:transparent}.app-dialog-panel{position:relative;z-index:0;display:flex;flex-direction:column;max-height:min(88vh,40rem);width:100%;pointer-events:auto;overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;box-sizing:border-box;border-radius:10px;border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .12));background:var(--app-color-surface, #fff);box-shadow:0 4px 6px -1px #00000014,0 12px 28px -8px #1a2f452e;outline:none;animation:app-lib-dialog-panel-in .28s cubic-bezier(.22,1,.36,1) both}.app-dialog-panel--sm{max-width:min(28rem,94vw)}.app-dialog-panel--md{max-width:min(40rem,94vw)}.app-dialog-panel--lg{max-width:min(56rem,96vw)}@media (prefers-reduced-motion: reduce){.app-dialog-panel{animation:none}}.app-dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:1rem 1rem .65rem;border-bottom:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));flex:0 0 auto}.app-dialog-title{margin:0;font-size:1.05rem;font-weight:600;line-height:1.3;color:var(--app-color-text-primary, #1a2f45)}.app-dialog-description{margin:0;padding:.65rem 1rem;font-size:.88rem;line-height:1.45;color:var(--app-color-text-secondary, #5a7fa3);flex:0 0 auto}.app-dialog-close{flex:0 0 auto;width:2rem;height:2rem;margin:0;padding:0;border:1px solid var(--app-color-border, #d4d4d4);border-radius:6px;background:var(--app-color-surface-alt, #fff);color:var(--app-color-text-secondary, #5a7fa3);font-size:1.35rem;line-height:1;cursor:pointer}.app-dialog-close:hover{background:var(--app-color-hover-bg, rgba(43, 127, 217, .08))}.app-dialog-close:focus-visible{outline:2px solid var(--app-color-focus-ring-strong, rgba(43, 127, 217, .45));outline-offset:2px}.app-dialog-body{padding:1rem;flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;font-size:.9rem;line-height:1.5;color:var(--app-color-text-primary, #1a2f45)}.app-dialog-footer{flex:0 0 auto;padding:.65rem 1rem 1rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, .09));display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}.app-dialog-footer:empty{display:none;padding:0;border:none}\n"] }]
|
|
7435
7489
|
}], propDecorators: { open: [{
|
|
7436
7490
|
type: Input,
|
|
7437
7491
|
args: [{ transform: booleanAttribute }]
|
|
@@ -7502,6 +7556,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7502
7556
|
args: ['cancelBtn']
|
|
7503
7557
|
}] } });
|
|
7504
7558
|
|
|
7559
|
+
/**
|
|
7560
|
+
* Substituto do `BlockScrollStrategy` do CDK para modais Structra (Dialog de confirmação,
|
|
7561
|
+
* loading, etc.): activa {@link lockPageScrollAppDialog} em vez de `cdk-global-scrollblock`
|
|
7562
|
+
* com `html` deslocado — alinha o backdrop do overlay ao viewport real.
|
|
7563
|
+
*/
|
|
7564
|
+
class AppLibLightBlockScrollStrategy {
|
|
7565
|
+
constructor() {
|
|
7566
|
+
this.snapshot = null;
|
|
7567
|
+
}
|
|
7568
|
+
attach(_overlayRef) { }
|
|
7569
|
+
enable() {
|
|
7570
|
+
this.snapshot = lockPageScrollAppDialog();
|
|
7571
|
+
}
|
|
7572
|
+
disable() {
|
|
7573
|
+
if (this.snapshot !== null) {
|
|
7574
|
+
unlockPageScrollAppDialog(this.snapshot);
|
|
7575
|
+
this.snapshot = null;
|
|
7576
|
+
}
|
|
7577
|
+
}
|
|
7578
|
+
}
|
|
7579
|
+
|
|
7505
7580
|
/** Classes aplicadas ao painel CDK Dialog + tema da app. */
|
|
7506
7581
|
function libDialogPanelClasses(theme, extra = []) {
|
|
7507
7582
|
const rest = Array.isArray(extra) ? extra : [extra];
|
|
@@ -7530,6 +7605,7 @@ class ConfirmDialogService {
|
|
|
7530
7605
|
panelClass: libDialogPanelClasses(this.theme),
|
|
7531
7606
|
autoFocus: false,
|
|
7532
7607
|
ariaModal: true,
|
|
7608
|
+
scrollStrategy: new AppLibLightBlockScrollStrategy(),
|
|
7533
7609
|
})
|
|
7534
7610
|
.closed.pipe(map((r) => r));
|
|
7535
7611
|
}
|
|
@@ -7714,6 +7790,7 @@ class LoadingDialogService {
|
|
|
7714
7790
|
panelClass: libDialogPanelClasses(this.theme),
|
|
7715
7791
|
autoFocus: false,
|
|
7716
7792
|
ariaModal: true,
|
|
7793
|
+
scrollStrategy: new AppLibLightBlockScrollStrategy(),
|
|
7717
7794
|
});
|
|
7718
7795
|
}
|
|
7719
7796
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
@@ -8861,5 +8938,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
8861
8938
|
* Generated bundle index. Do not edit.
|
|
8862
8939
|
*/
|
|
8863
8940
|
|
|
8864
|
-
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_IDS, ActionMenuComponent, AdaptiveDataViewComponent, AnchoredOverlayComponent, AppBreadcrumbComponent, AppDialogComponent, AppShellComponent, AppShellSidebarTemplateDirective, AppShellSidebarToggleComponent, AppSidebarComponent, AppSidebarToolbarDirective, AppThemeService, AppTopbarComponent, AppUserMenuComponent, BR_ESTADOS_NOME_SIGLA, BaseButtonComponent, BaseButtonType, BaseButtonVariant, BaseFieldComponent, BaseFieldDirective, BooleanFieldDirective, CardListComponent, CepFieldComponent, CheckboxFieldComponent, ConfirmDialogComponent, ConfirmDialogService, ContextMenuComponent, CpfCnpjFieldComponent, DashboardSectionComponent, DataCardComponent, DataGridComponent, DataListComponent, DataToolbarComponent, DateFieldComponent, DecimalFieldComponent, DetailsFieldComponent, DetailsViewComponent, DialogFooterDirective, DrawerComponent, DrawerSide, DrawerSize, DropdownBaseComponent, DropdownMenuComponent, DropdownMultiOptionFieldBase, DropdownOptionFieldBase, DropdownSearchFieldComponent, EmptyStateComponent, FormActionsAlign, FormActionsComponent, FormColComponent, FormGroupComponent, FormGroupVariant, FormRowAlign, FormRowComponent, FormRowGap, FormRowJustify, FormSectionComponent, FormTabComponent, FormTabsComponent, InputMaskFieldComponent, IntegerFieldComponent, LayoutStackAlign, LayoutStackComponent, LibDialogSize, ListItemComponent, LoadingDialogComponent, LoadingDialogService, MaskedTextFieldBase, MenuDividerComponent, MenuDropdownPlacement, MenuGroupComponent, MenuListComponent, MultiselectFieldComponent, NgControlFieldDirective, OverlayPlacement, PasswordFieldComponent, PhoneFieldComponent, PopoverBodyTemplateDirective, PopoverComponent, PopoverFooterTemplateDirective, PopoverTriggerDirective, STRUCTRA_UI, SelectFieldComponent, SkeletonBlockComponent, SkeletonCardComponent, SkeletonFieldShellComponent, SkeletonListComponent, SkeletonTableComponent, SkeletonTextComponent, StatCardComponent, StatusBadgeComponent, SwitchFieldComponent, TableEmptyStateComponent, TableToolbarComponent, TextFieldComponent, TextareaFieldComponent, ToastHostComponent, ToastService, TooltipComponent, TooltipPanelTemplateDirective, ValidationSummaryComponent, anchoredOverlayPositions, applyPickedCalendarDate, buildDecimalBrDisplay, buildDecimalBrParseString, buildEmptyStateOverlayHtml, caretIndexFromIntegerDigitCount, caretIndexFromSemantic, cepMaskCompleteValidator, cpfCnpjMaskCompleteValidator, escapeHtml, extractDecimalBrParts, fixedDigitsMaskCompleteValidator, formatDateTimePtBr, formatDecimalBr, formatIntegerThousandsBr, formatMaskDigits, formatUiFieldDateValue, libDialogPanelClasses, mapEstadosToOptions, maskDigitCount, normalizeFormDateValue, parseDecimalBr, parseIntegerString, parseUiFieldDateValue, phoneBrMaskCompleteValidator, resolveControlAtPath, sanitizeDecimalBrInput, sanitizeIntegerDigits, sectionHasVisibleInvalid, semanticCaretAt, semanticIntegerDigitCountLeft, stripToDigits, subscribeMarkForCheckOnInvalidUiRefresh, subtreeHasVisibleInvalid };
|
|
8941
|
+
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_IDS, ActionMenuComponent, AdaptiveDataViewComponent, AnchoredOverlayComponent, AppBreadcrumbComponent, AppDialogComponent, AppLibLightBlockScrollStrategy, AppShellComponent, AppShellSidebarTemplateDirective, AppShellSidebarToggleComponent, AppSidebarComponent, AppSidebarToolbarDirective, AppThemeService, AppTopbarComponent, AppUserMenuComponent, BR_ESTADOS_NOME_SIGLA, BaseButtonComponent, BaseButtonType, BaseButtonVariant, BaseFieldComponent, BaseFieldDirective, BooleanFieldDirective, CardListComponent, CepFieldComponent, CheckboxFieldComponent, ConfirmDialogComponent, ConfirmDialogService, ContextMenuComponent, CpfCnpjFieldComponent, DashboardSectionComponent, DataCardComponent, DataGridComponent, DataListComponent, DataToolbarComponent, DateFieldComponent, DecimalFieldComponent, DetailsFieldComponent, DetailsViewComponent, DialogFooterDirective, DrawerComponent, DrawerSide, DrawerSize, DropdownBaseComponent, DropdownMenuComponent, DropdownMultiOptionFieldBase, DropdownOptionFieldBase, DropdownSearchFieldComponent, EmptyStateComponent, FormActionsAlign, FormActionsComponent, FormColComponent, FormGroupComponent, FormGroupVariant, FormRowAlign, FormRowComponent, FormRowGap, FormRowJustify, FormSectionComponent, FormTabComponent, FormTabsComponent, InputMaskFieldComponent, IntegerFieldComponent, LayoutStackAlign, LayoutStackComponent, LibDialogSize, ListItemComponent, LoadingDialogComponent, LoadingDialogService, MaskedTextFieldBase, MenuDividerComponent, MenuDropdownPlacement, MenuGroupComponent, MenuListComponent, MultiselectFieldComponent, NgControlFieldDirective, OverlayPlacement, PasswordFieldComponent, PhoneFieldComponent, PopoverBodyTemplateDirective, PopoverComponent, PopoverFooterTemplateDirective, PopoverTriggerDirective, STRUCTRA_UI, SelectFieldComponent, SkeletonBlockComponent, SkeletonCardComponent, SkeletonFieldShellComponent, SkeletonListComponent, SkeletonTableComponent, SkeletonTextComponent, StatCardComponent, StatusBadgeComponent, SwitchFieldComponent, TableEmptyStateComponent, TableToolbarComponent, TextFieldComponent, TextareaFieldComponent, ToastHostComponent, ToastService, TooltipComponent, TooltipPanelTemplateDirective, ValidationSummaryComponent, anchoredOverlayPositions, applyPickedCalendarDate, buildDecimalBrDisplay, buildDecimalBrParseString, buildEmptyStateOverlayHtml, caretIndexFromIntegerDigitCount, caretIndexFromSemantic, cepMaskCompleteValidator, cpfCnpjMaskCompleteValidator, escapeHtml, extractDecimalBrParts, fixedDigitsMaskCompleteValidator, formatDateTimePtBr, formatDecimalBr, formatIntegerThousandsBr, formatMaskDigits, formatUiFieldDateValue, libDialogPanelClasses, mapEstadosToOptions, maskDigitCount, normalizeFormDateValue, parseDecimalBr, parseIntegerString, parseUiFieldDateValue, phoneBrMaskCompleteValidator, resolveControlAtPath, sanitizeDecimalBrInput, sanitizeIntegerDigits, sectionHasVisibleInvalid, semanticCaretAt, semanticIntegerDigitCountLeft, stripToDigits, subscribeMarkForCheckOnInvalidUiRefresh, subtreeHasVisibleInvalid };
|
|
8865
8942
|
//# sourceMappingURL=structra-ui.mjs.map
|