@taiga-ui/core 5.30.0 → 5.31.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/taiga-ui-core-components-button.mjs +2 -2
- package/fesm2022/taiga-ui-core-components-cell.mjs +3 -3
- package/fesm2022/taiga-ui-core-components-checkbox.mjs +2 -2
- package/fesm2022/taiga-ui-core-components-data-list.mjs +4 -4
- package/fesm2022/taiga-ui-core-components-icon.mjs +2 -2
- package/fesm2022/taiga-ui-core-components-label.mjs +3 -3
- package/fesm2022/taiga-ui-core-components-link.mjs +2 -2
- package/fesm2022/taiga-ui-core-components-notification.mjs +2 -2
- package/fesm2022/taiga-ui-core-components-radio.mjs +2 -2
- package/fesm2022/taiga-ui-core-components-root.mjs +1 -1
- package/fesm2022/taiga-ui-core-components-scrollbar.mjs +3 -3
- package/fesm2022/taiga-ui-core-components-textfield.mjs +5 -5
- package/fesm2022/taiga-ui-core-components-textfield.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-title.mjs +3 -3
- package/fesm2022/taiga-ui-core-directives-appearance.mjs +3 -3
- package/fesm2022/taiga-ui-core-directives-group.mjs +3 -3
- package/fesm2022/taiga-ui-core-directives-icons.mjs +3 -3
- package/fesm2022/taiga-ui-core-portals-alert.mjs +3 -3
- package/fesm2022/taiga-ui-core-portals-dialog.mjs +2 -2
- package/fesm2022/taiga-ui-core-portals-dropdown.mjs +16 -13
- package/fesm2022/taiga-ui-core-portals-dropdown.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-portals-hint.mjs +15 -9
- package/fesm2022/taiga-ui-core-portals-hint.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-portals-modal.mjs +3 -3
- package/fesm2022/taiga-ui-core-services.mjs +30 -3
- package/fesm2022/taiga-ui-core-services.mjs.map +1 -1
- package/package.json +8 -8
- package/portals/dropdown/dropdown-anchored.directive.d.ts +1 -0
- package/portals/hint/hint-anchored.directive.d.ts +1 -0
- package/services/css-zoom.service.d.ts +14 -0
- package/services/index.d.ts +1 -0
|
@@ -95,7 +95,7 @@ class TuiDialogComponent {
|
|
|
95
95
|
});
|
|
96
96
|
}
|
|
97
97
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
98
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: TuiDialogComponent, isStandalone: true, selector: "tui-dialog", host: { attributes: { "data-tui-version": "5.30.0" }, properties: { "attr.data-appearance": "context.appearance", "attr.data-size": "context.size", "class._closable": "context.closable", "class.tui-backdrop-hidden": "context.appearance.includes(\"fullscreen\")" } }, providers: [TuiDialogCloseService], hostDirectives: [{ directive: i1.TuiAnimated }], ngImport: i0, template: "@if (context.closable) {\n <button\n tabindex=\"0\"\n tuiButtonX\n [appearance]=\"context.appearance.includes('fullscreen') ? 'action' : 'neutral'\"\n (click)=\"close$.next()\"\n >\n {{ close() }}\n </button>\n}\n\n@if (!primitive && context.label) {\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n </hgroup>\n </header>\n}\n\n<ng-container *polymorpheusOutlet=\"context.content as text; context: context\">\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n <p [innerHTML]=\"text\"></p>\n </hgroup>\n </header>\n @if (context.closable || context.dismissible) {\n <footer>\n <button\n size=\"m\"\n tuiAutoFocus\n tuiButton\n type=\"button\"\n (click)=\"context.$implicit.complete()\"\n >\n {{ context.data || 'OK' }}\n </button>\n </footer>\n }\n</ng-container>\n", styles: ["tui-dialog:where(*[data-tui-version=\"5.30.0\"]){position:relative;box-sizing:border-box;overflow-wrap:break-word;font:var(--tui-typography-body-m);background:var(--tui-background-elevation-1);box-shadow:var(--tui-shadow-popup)}tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header{padding-inline-end:2.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>header p,tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header p{margin-inline-end:-2.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header [tuiTitle],tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header [tuiTitle]{font:inherit}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header p,tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header p{margin:.25rem 0 0;font:var(--tui-typography-body-m)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header p:empty,tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header p:empty{display:none}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>[tuiButtonX]{position:absolute;z-index:1;inset-block-start:1rem;inset-inline-end:1rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga]{max-inline-size:calc(100vw - 5rem);margin:2.5rem;padding:1.75rem;border-radius:1.5rem;--tui-from: translateY(2rem)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga].tui-enter,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]{inline-size:25rem;padding:1.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.25rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>footer,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>footer{margin-block-start:1.25rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m],tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]{inline-size:37.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h4)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]{inline-size:50rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga]>footer,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga]>ng-component>footer{display:flex;justify-content:flex-end;flex-wrap:wrap-reverse;gap:.75rem;margin-block-start:2rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]{display:flex;flex-direction:column;block-size:100%;inline-size:100%;max-inline-size:100vw;padding:env(safe-area-inset-top) max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline)) max(2rem,env(safe-area-inset-bottom));background:var(--tui-background-base);box-shadow:none;--tui-width: min(45rem, 100vw);--tui-from: translateY(2rem);--tui-padding-inline: 1rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size].tui-enter,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{position:sticky;inset-block-start:env(safe-area-inset-top);block-size:4rem;inline-size:auto;align-self:flex-end;margin-block-end:2rem;border-radius:0!important;font:var(--tui-typography-body-l)!important;border-image:conic-gradient(var(--tui-background-base) 0 0) fill 0 / 0 / env(safe-area-inset-top) 100vw 0}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]:before{display:none}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size].tui-app-bar>[tuiButtonX]{display:none}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]:not(._closable):not(.tui-app-bar):before{content:\"\";block-size:1.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{position:sticky;z-index:1;inset-block-start:0;order:-1;border-inline-end:calc(50vw - var(--tui-width) / 2) solid transparent;border-inline-start:calc(50vw - var(--tui-width) / 2) solid transparent;margin:0 calc(var(--tui-width) / 2 - 50vw) 2rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar[data-size=l],tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar[data-size=l]{border-width:max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline))}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h3);margin-block-end:2rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{display:flex;gap:.5rem .75rem;padding:2rem calc(50vw - var(--tui-width) / 2);margin:0 calc(var(--tui-width) / 2 - 50vw) calc(-2rem - env(safe-area-inset-top))}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{inset-inline-start:0;inset-inline-end:0}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{flex-direction:row;background:color-mix(in hsl,var(--tui-background-base) 80%,transparent);-webkit-backdrop-filter:blur(2rem);backdrop-filter:blur(2rem)}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{display:none}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer>a,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>a{inline-size:auto}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]{padding-block-end:max(1rem,env(safe-area-inset-bottom));--tui-from: translateY(4rem)}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{align-self:flex-start;block-size:3.5rem;margin-block-end:1rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{margin:calc(-1*env(safe-area-inset-top)) -1rem 1rem;padding-block-start:env(safe-area-inset-top);box-sizing:content-box}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{margin:-.25rem 0 1.5rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{padding:0 1rem max(1rem,env(safe-area-inset-bottom));margin:1.5rem -1rem calc(-1*max(1rem,env(safe-area-inset-bottom)))}[data-platform=ios] tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX][tuiButtonX]{block-size:2.75rem}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiAutoFocus, selector: "[tuiAutoFocus]", inputs: ["tuiAutoFocus"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],label[tuiButton],a[tuiIconButton],button[tuiIconButton],label[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: TuiButtonX, selector: "[tuiButtonX]" }, { kind: "directive", type: TuiTitle, selector: "[tuiTitle]", inputs: ["tuiTitle"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
|
98
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: TuiDialogComponent, isStandalone: true, selector: "tui-dialog", host: { attributes: { "data-tui-version": "5.31.0" }, properties: { "attr.data-appearance": "context.appearance", "attr.data-size": "context.size", "class._closable": "context.closable", "class.tui-backdrop-hidden": "context.appearance.includes(\"fullscreen\")" } }, providers: [TuiDialogCloseService], hostDirectives: [{ directive: i1.TuiAnimated }], ngImport: i0, template: "@if (context.closable) {\n <button\n tabindex=\"0\"\n tuiButtonX\n [appearance]=\"context.appearance.includes('fullscreen') ? 'action' : 'neutral'\"\n (click)=\"close$.next()\"\n >\n {{ close() }}\n </button>\n}\n\n@if (!primitive && context.label) {\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n </hgroup>\n </header>\n}\n\n<ng-container *polymorpheusOutlet=\"context.content as text; context: context\">\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n <p [innerHTML]=\"text\"></p>\n </hgroup>\n </header>\n @if (context.closable || context.dismissible) {\n <footer>\n <button\n size=\"m\"\n tuiAutoFocus\n tuiButton\n type=\"button\"\n (click)=\"context.$implicit.complete()\"\n >\n {{ context.data || 'OK' }}\n </button>\n </footer>\n }\n</ng-container>\n", styles: ["tui-dialog:where(*[data-tui-version=\"5.31.0\"]){position:relative;box-sizing:border-box;overflow-wrap:break-word;font:var(--tui-typography-body-m);background:var(--tui-background-elevation-1);box-shadow:var(--tui-shadow-popup)}tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header{padding-inline-end:2.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>header p,tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header p{margin-inline-end:-2.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header [tuiTitle],tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header [tuiTitle]{font:inherit}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header p,tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header p{margin:.25rem 0 0;font:var(--tui-typography-body-m)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header p:empty,tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header p:empty{display:none}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>[tuiButtonX]{position:absolute;z-index:1;inset-block-start:1rem;inset-inline-end:1rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga]{max-inline-size:calc(100vw - 5rem);margin:2.5rem;padding:1.75rem;border-radius:1.5rem;--tui-from: translateY(2rem)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga].tui-enter,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]{inline-size:25rem;padding:1.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.25rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>footer,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>footer{margin-block-start:1.25rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m],tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]{inline-size:37.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h4)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]{inline-size:50rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga]>footer,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga]>ng-component>footer{display:flex;justify-content:flex-end;flex-wrap:wrap-reverse;gap:.75rem;margin-block-start:2rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]{display:flex;flex-direction:column;block-size:100%;inline-size:100%;max-inline-size:100vw;padding:env(safe-area-inset-top) max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline)) max(2rem,env(safe-area-inset-bottom));background:var(--tui-background-base);box-shadow:none;--tui-width: min(45rem, 100vw);--tui-from: translateY(2rem);--tui-padding-inline: 1rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size].tui-enter,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{position:sticky;inset-block-start:env(safe-area-inset-top);block-size:4rem;inline-size:auto;align-self:flex-end;margin-block-end:2rem;border-radius:0!important;font:var(--tui-typography-body-l)!important;border-image:conic-gradient(var(--tui-background-base) 0 0) fill 0 / 0 / env(safe-area-inset-top) 100vw 0}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]:before{display:none}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size].tui-app-bar>[tuiButtonX]{display:none}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]:not(._closable):not(.tui-app-bar):before{content:\"\";block-size:1.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{position:sticky;z-index:1;inset-block-start:0;order:-1;border-inline-end:calc(50vw - var(--tui-width) / 2) solid transparent;border-inline-start:calc(50vw - var(--tui-width) / 2) solid transparent;margin:0 calc(var(--tui-width) / 2 - 50vw) 2rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar[data-size=l],tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar[data-size=l]{border-width:max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline))}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h3);margin-block-end:2rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{display:flex;gap:.5rem .75rem;padding:2rem calc(50vw - var(--tui-width) / 2);margin:0 calc(var(--tui-width) / 2 - 50vw) calc(-2rem - env(safe-area-inset-top))}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{inset-inline-start:0;inset-inline-end:0}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{flex-direction:row;background:color-mix(in hsl,var(--tui-background-base) 80%,transparent);-webkit-backdrop-filter:blur(2rem);backdrop-filter:blur(2rem)}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{display:none}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer>a,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>a{inline-size:auto}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]{padding-block-end:max(1rem,env(safe-area-inset-bottom));--tui-from: translateY(4rem)}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{align-self:flex-start;block-size:3.5rem;margin-block-end:1rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{margin:calc(-1*env(safe-area-inset-top)) -1rem 1rem;padding-block-start:env(safe-area-inset-top);box-sizing:content-box}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{margin:-.25rem 0 1.5rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{padding:0 1rem max(1rem,env(safe-area-inset-bottom));margin:1.5rem -1rem calc(-1*max(1rem,env(safe-area-inset-bottom)))}[data-platform=ios] tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX][tuiButtonX]{block-size:2.75rem}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiAutoFocus, selector: "[tuiAutoFocus]", inputs: ["tuiAutoFocus"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],label[tuiButton],a[tuiIconButton],button[tuiIconButton],label[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: TuiButtonX, selector: "[tuiButtonX]" }, { kind: "directive", type: TuiTitle, selector: "[tuiTitle]", inputs: ["tuiTitle"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
|
99
99
|
}
|
|
100
100
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiDialogComponent, decorators: [{
|
|
101
101
|
type: Component,
|
|
@@ -105,7 +105,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
|
|
|
105
105
|
'[attr.data-size]': 'context.size',
|
|
106
106
|
'[class._closable]': 'context.closable',
|
|
107
107
|
'[class.tui-backdrop-hidden]': 'context.appearance.includes("fullscreen")',
|
|
108
|
-
}, template: "@if (context.closable) {\n <button\n tabindex=\"0\"\n tuiButtonX\n [appearance]=\"context.appearance.includes('fullscreen') ? 'action' : 'neutral'\"\n (click)=\"close$.next()\"\n >\n {{ close() }}\n </button>\n}\n\n@if (!primitive && context.label) {\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n </hgroup>\n </header>\n}\n\n<ng-container *polymorpheusOutlet=\"context.content as text; context: context\">\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n <p [innerHTML]=\"text\"></p>\n </hgroup>\n </header>\n @if (context.closable || context.dismissible) {\n <footer>\n <button\n size=\"m\"\n tuiAutoFocus\n tuiButton\n type=\"button\"\n (click)=\"context.$implicit.complete()\"\n >\n {{ context.data || 'OK' }}\n </button>\n </footer>\n }\n</ng-container>\n", styles: ["tui-dialog:where(*[data-tui-version=\"5.30.0\"]){position:relative;box-sizing:border-box;overflow-wrap:break-word;font:var(--tui-typography-body-m);background:var(--tui-background-elevation-1);box-shadow:var(--tui-shadow-popup)}tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header{padding-inline-end:2.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>header p,tui-dialog:where(*[data-tui-version=\"5.30.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header p{margin-inline-end:-2.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header [tuiTitle],tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header [tuiTitle]{font:inherit}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header p,tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header p{margin:.25rem 0 0;font:var(--tui-typography-body-m)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>header p:empty,tui-dialog:where(*[data-tui-version=\"5.30.0\"])>ng-component>header p:empty{display:none}tui-dialog:where(*[data-tui-version=\"5.30.0\"])>[tuiButtonX]{position:absolute;z-index:1;inset-block-start:1rem;inset-inline-end:1rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga]{max-inline-size:calc(100vw - 5rem);margin:2.5rem;padding:1.75rem;border-radius:1.5rem;--tui-from: translateY(2rem)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga].tui-enter,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]{inline-size:25rem;padding:1.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.25rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>footer,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=s]>ng-component>footer{margin-block-start:1.25rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m],tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]{inline-size:37.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h4)}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga][data-size=l]{inline-size:50rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga]>footer,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=taiga]>ng-component>footer{display:flex;justify-content:flex-end;flex-wrap:wrap-reverse;gap:.75rem;margin-block-start:2rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]{display:flex;flex-direction:column;block-size:100%;inline-size:100%;max-inline-size:100vw;padding:env(safe-area-inset-top) max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline)) max(2rem,env(safe-area-inset-bottom));background:var(--tui-background-base);box-shadow:none;--tui-width: min(45rem, 100vw);--tui-from: translateY(2rem);--tui-padding-inline: 1rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size].tui-enter,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{position:sticky;inset-block-start:env(safe-area-inset-top);block-size:4rem;inline-size:auto;align-self:flex-end;margin-block-end:2rem;border-radius:0!important;font:var(--tui-typography-body-l)!important;border-image:conic-gradient(var(--tui-background-base) 0 0) fill 0 / 0 / env(safe-area-inset-top) 100vw 0}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]:before{display:none}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size].tui-app-bar>[tuiButtonX]{display:none}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]:not(._closable):not(.tui-app-bar):before{content:\"\";block-size:1.5rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{position:sticky;z-index:1;inset-block-start:0;order:-1;border-inline-end:calc(50vw - var(--tui-width) / 2) solid transparent;border-inline-start:calc(50vw - var(--tui-width) / 2) solid transparent;margin:0 calc(var(--tui-width) / 2 - 50vw) 2rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar[data-size=l],tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar[data-size=l]{border-width:max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline))}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h3);margin-block-end:2rem}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{display:flex;gap:.5rem .75rem;padding:2rem calc(50vw - var(--tui-width) / 2);margin:0 calc(var(--tui-width) / 2 - 50vw) calc(-2rem - env(safe-area-inset-top))}tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{inset-inline-start:0;inset-inline-end:0}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{flex-direction:row;background:color-mix(in hsl,var(--tui-background-base) 80%,transparent);-webkit-backdrop-filter:blur(2rem);backdrop-filter:blur(2rem)}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{display:none}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer>a,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>a{inline-size:auto}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]{padding-block-end:max(1rem,env(safe-area-inset-bottom));--tui-from: translateY(4rem)}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{align-self:flex-start;block-size:3.5rem;margin-block-end:1rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{margin:calc(-1*env(safe-area-inset-top)) -1rem 1rem;padding-block-start:env(safe-area-inset-top);box-sizing:content-box}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{margin:-.25rem 0 1.5rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{padding:0 1rem max(1rem,env(safe-area-inset-bottom));margin:1.5rem -1rem calc(-1*max(1rem,env(safe-area-inset-bottom)))}[data-platform=ios] tui-dialog:where(*[data-tui-version=\"5.30.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX][tuiButtonX]{block-size:2.75rem}\n"] }]
|
|
108
|
+
}, template: "@if (context.closable) {\n <button\n tabindex=\"0\"\n tuiButtonX\n [appearance]=\"context.appearance.includes('fullscreen') ? 'action' : 'neutral'\"\n (click)=\"close$.next()\"\n >\n {{ close() }}\n </button>\n}\n\n@if (!primitive && context.label) {\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n </hgroup>\n </header>\n}\n\n<ng-container *polymorpheusOutlet=\"context.content as text; context: context\">\n <header>\n <hgroup tuiTitle>\n <h2\n [id]=\"context.id\"\n [innerHTML]=\"context.label\"\n ></h2>\n <p [innerHTML]=\"text\"></p>\n </hgroup>\n </header>\n @if (context.closable || context.dismissible) {\n <footer>\n <button\n size=\"m\"\n tuiAutoFocus\n tuiButton\n type=\"button\"\n (click)=\"context.$implicit.complete()\"\n >\n {{ context.data || 'OK' }}\n </button>\n </footer>\n }\n</ng-container>\n", styles: ["tui-dialog:where(*[data-tui-version=\"5.31.0\"]){position:relative;box-sizing:border-box;overflow-wrap:break-word;font:var(--tui-typography-body-m);background:var(--tui-background-elevation-1);box-shadow:var(--tui-shadow-popup)}tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header{padding-inline-end:2.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>header p,tui-dialog:where(*[data-tui-version=\"5.31.0\"]):not([data-appearance~=fullscreen])._closable>ng-component>header p{margin-inline-end:-2.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header [tuiTitle],tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header [tuiTitle]{font:inherit}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header p,tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header p{margin:.25rem 0 0;font:var(--tui-typography-body-m)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>header p:empty,tui-dialog:where(*[data-tui-version=\"5.31.0\"])>ng-component>header p:empty{display:none}tui-dialog:where(*[data-tui-version=\"5.31.0\"])>[tuiButtonX]{position:absolute;z-index:1;inset-block-start:1rem;inset-inline-end:1rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga]{max-inline-size:calc(100vw - 5rem);margin:2.5rem;padding:1.75rem;border-radius:1.5rem;--tui-from: translateY(2rem)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga].tui-enter,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]{inline-size:25rem;padding:1.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h5)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.25rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>footer,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=s]>ng-component>footer{margin-block-start:1.25rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m],tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]{inline-size:37.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h4)}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=m]>ng-component>[tuiSlides]>*>header:not(:last-child),tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]>ng-component>[tuiSlides]>*>header:not(:last-child){margin-block-end:1.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga][data-size=l]{inline-size:50rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga]>footer,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=taiga]>ng-component>footer{display:flex;justify-content:flex-end;flex-wrap:wrap-reverse;gap:.75rem;margin-block-start:2rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]{display:flex;flex-direction:column;block-size:100%;inline-size:100%;max-inline-size:100vw;padding:env(safe-area-inset-top) max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline)) max(2rem,env(safe-area-inset-bottom));background:var(--tui-background-base);box-shadow:none;--tui-width: min(45rem, 100vw);--tui-from: translateY(2rem);--tui-padding-inline: 1rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size].tui-enter,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size].tui-leave{animation-name:tuiFade,tuiSlide}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{position:sticky;inset-block-start:env(safe-area-inset-top);block-size:4rem;inline-size:auto;align-self:flex-end;margin-block-end:2rem;border-radius:0!important;font:var(--tui-typography-body-l)!important;border-image:conic-gradient(var(--tui-background-base) 0 0) fill 0 / 0 / env(safe-area-inset-top) 100vw 0}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]:before{display:none}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size].tui-app-bar>[tuiButtonX]{display:none}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]:not(._closable):not(.tui-app-bar):before{content:\"\";block-size:1.5rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{position:sticky;z-index:1;inset-block-start:0;order:-1;border-inline-end:calc(50vw - var(--tui-width) / 2) solid transparent;border-inline-start:calc(50vw - var(--tui-width) / 2) solid transparent;margin:0 calc(var(--tui-width) / 2 - 50vw) 2rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar[data-size=l],tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar[data-size=l]{border-width:max(calc(50vw - var(--tui-width) / 2),var(--tui-padding-inline))}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{font:var(--tui-typography-heading-h3);margin-block-end:2rem}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{display:flex;gap:.5rem .75rem;padding:2rem calc(50vw - var(--tui-width) / 2);margin:0 calc(var(--tui-width) / 2 - 50vw) calc(-2rem - env(safe-area-inset-top))}tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{inset-inline-start:0;inset-inline-end:0}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{flex-direction:row;background:color-mix(in hsl,var(--tui-background-base) 80%,transparent);-webkit-backdrop-filter:blur(2rem);backdrop-filter:blur(2rem)}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer:before,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer:before{display:none}tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>button,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer>a,tui-root:not(._mobile) tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer>a{inline-size:auto}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]{padding-block-end:max(1rem,env(safe-area-inset-bottom));--tui-from: translateY(4rem)}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX]{align-self:flex-start;block-size:3.5rem;margin-block-end:1rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>tui-app-bar,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>tui-app-bar{margin:calc(-1*env(safe-area-inset-top)) -1rem 1rem;padding-block-start:env(safe-area-inset-top);box-sizing:content-box}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiSlides]>*>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>header,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>[tuiSlides]>*>header{margin:-.25rem 0 1.5rem}tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>footer,tui-root._mobile tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>ng-component>footer{padding:0 1rem max(1rem,env(safe-area-inset-bottom));margin:1.5rem -1rem calc(-1*max(1rem,env(safe-area-inset-bottom)))}[data-platform=ios] tui-dialog:where(*[data-tui-version=\"5.31.0\"])[data-appearance~=fullscreen][data-size]>[tuiButtonX][tuiButtonX]{block-size:2.75rem}\n"] }]
|
|
109
109
|
}] });
|
|
110
110
|
|
|
111
111
|
const [TUI_DIALOG_OPTIONS, tuiDialogOptionsProvider] = tuiCreateOptions({
|
|
@@ -19,7 +19,7 @@ import { TUI_VIEWPORT, TUI_ANCHOR_SUPPORT, TUI_DARK_MODE, TUI_SELECTION_STREAM }
|
|
|
19
19
|
import { EMPTY_CLIENT_RECT, TUI_TRUE_HANDLER, CHAR_ZERO_WIDTH_SPACE, CHAR_NO_BREAK_SPACE } from '@taiga-ui/cdk/constants';
|
|
20
20
|
import { tuiClamp } from '@taiga-ui/cdk/utils/math';
|
|
21
21
|
import { tuiPx, tuiGenerateId, tuiSetSignal, tuiIsString, tuiIsPresent } from '@taiga-ui/cdk/utils/miscellaneous';
|
|
22
|
-
import { TuiVisualViewportService, TuiPositionService } from '@taiga-ui/core/services';
|
|
22
|
+
import { TuiVisualViewportService, TuiCSSZoomService, TuiPositionService } from '@taiga-ui/core/services';
|
|
23
23
|
import { tuiOverrideOptions, tuiIsEditingKey } from '@taiga-ui/core/utils/miscellaneous';
|
|
24
24
|
import { DOCUMENT, isPlatformBrowser } from '@angular/common';
|
|
25
25
|
import * as i1$1 from '@taiga-ui/cdk/directives/obscured';
|
|
@@ -91,11 +91,12 @@ class TuiDropdownAnchored {
|
|
|
91
91
|
this.rect = inject(TuiRectAccessor);
|
|
92
92
|
this.viewport = inject(TUI_VIEWPORT);
|
|
93
93
|
this.vvs = inject(TuiVisualViewportService);
|
|
94
|
+
this.zoom = inject(TuiCSSZoomService);
|
|
94
95
|
this.options = inject(TUI_DROPDOWN_OPTIONS);
|
|
95
96
|
this.position = this.directive.position;
|
|
96
97
|
this.accessor = inject(TuiPositionAccessor);
|
|
97
98
|
this.styles$ = inject(TuiPositionService).pipe(takeWhile(() => this.directive.el.isConnected &&
|
|
98
|
-
this.directive.el.getClientRects().length > 0), map((v) => (this.position === 'fixed' ? this.vvs.correct(v) : v)), map((point) => this.getStyles(...point)), takeUntilDestroyed());
|
|
99
|
+
this.directive.el.getClientRects().length > 0), map((v) => (this.position === 'fixed' ? this.vvs.correct(v) : v)), map((point) => this.getStyles(...this.zoom.descale(point))), takeUntilDestroyed());
|
|
99
100
|
this.anchored = inject(TUI_ANCHOR_SUPPORT) &&
|
|
100
101
|
'position' in this.accessor &&
|
|
101
102
|
this.viewport.type === 'window';
|
|
@@ -124,32 +125,33 @@ class TuiDropdownAnchored {
|
|
|
124
125
|
}
|
|
125
126
|
getStyles(x, y) {
|
|
126
127
|
const { maxHeight, minHeight, offset, limitWidth } = this.options;
|
|
127
|
-
const parent = this.el.offsetParent?.getBoundingClientRect() || EMPTY_CLIENT_RECT;
|
|
128
|
+
const parent = this.zoom.descale(this.el.offsetParent?.getBoundingClientRect() || EMPTY_CLIENT_RECT);
|
|
128
129
|
const { left = 0, top = 0 } = this.position === 'fixed' ? {} : parent;
|
|
129
|
-
const rect = this.rect.getClientRect();
|
|
130
|
-
const viewport = this.viewport.getClientRect();
|
|
131
|
-
const zoom = this.directive.el.currentCSSZoom || 1;
|
|
130
|
+
const rect = this.zoom.descale(this.rect.getClientRect());
|
|
131
|
+
const viewport = this.zoom.descale(this.viewport.getClientRect());
|
|
132
132
|
const above = rect.top - viewport.top - 2 * offset;
|
|
133
133
|
const below = viewport.top + viewport.height - y - offset;
|
|
134
134
|
const available = y > rect.bottom ? below : above;
|
|
135
|
-
const height = this.el.getBoundingClientRect().right <= rect.left ||
|
|
135
|
+
const height = this.zoom.descale(this.el.getBoundingClientRect()).right <= rect.left ||
|
|
136
|
+
x >= rect.right
|
|
136
137
|
? maxHeight
|
|
137
138
|
: tuiClamp(available, minHeight, maxHeight);
|
|
138
139
|
y -= top;
|
|
139
140
|
x -= left;
|
|
140
141
|
return {
|
|
141
142
|
position: this.position,
|
|
142
|
-
top: tuiPx(Math.round(Math.max(y, offset - top)
|
|
143
|
-
left: tuiPx(Math.round(x
|
|
144
|
-
maxHeight: tuiPx(Math.round(height
|
|
145
|
-
width: limitWidth === 'fixed' ? tuiPx(Math.round(rect.width
|
|
146
|
-
minWidth: limitWidth === 'min' ? tuiPx(Math.round(rect.width
|
|
147
|
-
maxWidth: tuiPx(Math.round(viewport.width
|
|
143
|
+
top: tuiPx(Math.round(Math.max(y, offset - top))),
|
|
144
|
+
left: tuiPx(Math.round(x)),
|
|
145
|
+
maxHeight: tuiPx(Math.round(height)),
|
|
146
|
+
width: limitWidth === 'fixed' ? tuiPx(Math.round(rect.width)) : '',
|
|
147
|
+
minWidth: limitWidth === 'min' ? tuiPx(Math.round(rect.width)) : '',
|
|
148
|
+
maxWidth: tuiPx(Math.round(viewport.width) - MAX_WIDTH_GAP),
|
|
148
149
|
};
|
|
149
150
|
}
|
|
150
151
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiDropdownAnchored, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
151
152
|
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: TuiDropdownAnchored, isStandalone: true, host: { listeners: { "window:scrollend.zoneless.capture": "retrigger()" }, properties: { "class._anchored": "anchored" } }, providers: [
|
|
152
153
|
TuiPositionService,
|
|
154
|
+
TuiCSSZoomService,
|
|
153
155
|
tuiProvideAccessor(TuiPositionAccessor, 'dropdown'),
|
|
154
156
|
tuiProvideAccessor(TuiRectAccessor, 'dropdown'),
|
|
155
157
|
], ngImport: i0 }); }
|
|
@@ -159,6 +161,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
|
|
|
159
161
|
args: [{
|
|
160
162
|
providers: [
|
|
161
163
|
TuiPositionService,
|
|
164
|
+
TuiCSSZoomService,
|
|
162
165
|
tuiProvideAccessor(TuiPositionAccessor, 'dropdown'),
|
|
163
166
|
tuiProvideAccessor(TuiRectAccessor, 'dropdown'),
|
|
164
167
|
],
|