@taiga-ui/core 3.17.0-dev.main-c105795 → 3.17.0-dev.main-dba63e7
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/bundles/taiga-ui-core-components-dialog.umd.js +189 -167
- package/bundles/taiga-ui-core-components-dialog.umd.js.map +1 -1
- package/bundles/taiga-ui-core-components-svg.umd.js +19 -23
- package/bundles/taiga-ui-core-components-svg.umd.js.map +1 -1
- package/bundles/taiga-ui-core-components-tooltip.umd.js +7 -2
- package/bundles/taiga-ui-core-components-tooltip.umd.js.map +1 -1
- package/bundles/taiga-ui-core-directives-hint.umd.js +10 -8
- package/bundles/taiga-ui-core-directives-hint.umd.js.map +1 -1
- package/components/dialog/dialog-close.service.d.ts +15 -0
- package/components/dialog/dialog.component.d.ts +5 -4
- package/components/dialog/dialog.tokens.d.ts +2 -0
- package/components/dialog/index.d.ts +1 -1
- package/components/svg/deprecated-icons.d.ts +1 -58
- package/components/svg/svg-options.d.ts +2 -5
- package/components/svg/svg.component.d.ts +2 -3
- package/components/tooltip/tooltip.component.d.ts +2 -1
- package/directives/hint/hint-hover.directive.d.ts +3 -1
- package/esm2015/components/dialog/dialog-close.service.js +51 -0
- package/esm2015/components/dialog/dialog.component.js +26 -10
- package/esm2015/components/dialog/dialog.tokens.js +5 -1
- package/esm2015/components/dialog/index.js +2 -2
- package/esm2015/components/svg/deprecated-icons.js +7 -9
- package/esm2015/components/svg/svg-options.js +6 -1
- package/esm2015/components/svg/svg.component.js +5 -12
- package/esm2015/components/tooltip/tooltip.component.js +10 -5
- package/esm2015/directives/hint/hint-hover.directive.js +12 -10
- package/esm2015/directives/hint/hint.component.js +3 -2
- package/esm2015/interfaces/dialog-options.js +1 -1
- package/fesm2015/taiga-ui-core-components-dialog.js +85 -69
- package/fesm2015/taiga-ui-core-components-dialog.js.map +1 -1
- package/fesm2015/taiga-ui-core-components-svg.js +17 -20
- package/fesm2015/taiga-ui-core-components-svg.js.map +1 -1
- package/fesm2015/taiga-ui-core-components-tooltip.js +9 -4
- package/fesm2015/taiga-ui-core-components-tooltip.js.map +1 -1
- package/fesm2015/taiga-ui-core-directives-hint.js +12 -10
- package/fesm2015/taiga-ui-core-directives-hint.js.map +1 -1
- package/interfaces/dialog-options.d.ts +4 -3
- package/package.json +1 -1
- package/components/dialog/dialog.providers.d.ts +0 -5
- package/esm2015/components/dialog/dialog.providers.js +0 -51
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@taiga-ui/cdk'), require('@taiga-ui/core/animations'), require('@taiga-ui/core/tokens'), require('@tinkoff/ng-polymorpheus'), require('@angular/common'), require('@ng-web-apis/common'), require('@taiga-ui/core/utils
|
|
3
|
-
typeof define === 'function' && define.amd ? define('@taiga-ui/core/components/dialog', ['exports', '@angular/core', '@taiga-ui/cdk', '@taiga-ui/core/animations', '@taiga-ui/core/tokens', '@tinkoff/ng-polymorpheus', '@angular/common', '@ng-web-apis/common', '@taiga-ui/core/utils
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["taiga-ui"] = global["taiga-ui"] || {}, global["taiga-ui"].core = global["taiga-ui"].core || {}, global["taiga-ui"].core.components = global["taiga-ui"].core.components || {}, global["taiga-ui"].core.components.dialog = {}), global.ng.core, global.i4, global["taiga-ui"].core.animations, global["taiga-ui"].core.tokens, global.i3, global.ng.common, global.common, global["taiga-ui"].core.utils
|
|
5
|
-
})(this, (function (exports, i0, i4, animations, tokens, i3,
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@taiga-ui/cdk'), require('@taiga-ui/core/animations'), require('@taiga-ui/core/tokens'), require('@tinkoff/ng-polymorpheus'), require('rxjs'), require('rxjs/operators'), require('@angular/common'), require('@ng-web-apis/common'), require('@taiga-ui/core/utils'), require('@taiga-ui/core/components/button')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define('@taiga-ui/core/components/dialog', ['exports', '@angular/core', '@taiga-ui/cdk', '@taiga-ui/core/animations', '@taiga-ui/core/tokens', '@tinkoff/ng-polymorpheus', 'rxjs', 'rxjs/operators', '@angular/common', '@ng-web-apis/common', '@taiga-ui/core/utils', '@taiga-ui/core/components/button'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["taiga-ui"] = global["taiga-ui"] || {}, global["taiga-ui"].core = global["taiga-ui"].core || {}, global["taiga-ui"].core.components = global["taiga-ui"].core.components || {}, global["taiga-ui"].core.components.dialog = {}), global.ng.core, global.i4, global["taiga-ui"].core.animations, global["taiga-ui"].core.tokens, global.i3, global.rxjs, global.rxjs.operators, global.ng.common, global.common, global["taiga-ui"].core.utils, global["taiga-ui"].core.components.button));
|
|
5
|
+
})(this, (function (exports, i0, i4, animations, tokens, i3, i5, operators, i2, common, utils, i1) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopNamespace(e) {
|
|
8
8
|
if (e && e.__esModule) return e;
|
|
@@ -25,158 +25,30 @@
|
|
|
25
25
|
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
|
|
26
26
|
var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
|
|
27
27
|
var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
|
|
28
|
-
var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
|
|
29
28
|
var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
|
|
29
|
+
var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
|
|
30
30
|
var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
|
|
31
31
|
|
|
32
|
+
var TUI_DIALOG_DEFAULT_OPTIONS = {
|
|
33
|
+
size: "m",
|
|
34
|
+
required: false,
|
|
35
|
+
closeable: true,
|
|
36
|
+
dismissible: true,
|
|
37
|
+
label: "",
|
|
38
|
+
header: "",
|
|
39
|
+
};
|
|
32
40
|
var TUI_DIALOGS_CLOSE = new i0.InjectionToken("[TUI_DIALOGS_CLOSE]: A stream to close dialogs", {
|
|
33
41
|
factory: function () { return i5.EMPTY; },
|
|
34
42
|
});
|
|
35
|
-
var
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
{
|
|
40
|
-
provide:
|
|
41
|
-
|
|
42
|
-
i2.DOCUMENT,
|
|
43
|
-
common.WINDOW,
|
|
44
|
-
i0.ElementRef,
|
|
45
|
-
TUI_DIALOGS_CLOSE,
|
|
46
|
-
i4.TuiDestroyService,
|
|
47
|
-
i3.POLYMORPHEUS_CONTEXT,
|
|
48
|
-
],
|
|
49
|
-
useFactory: function (documentRef, windowRef, _a, close$, destroy$, _b) {
|
|
50
|
-
var nativeElement = _a.nativeElement;
|
|
51
|
-
var dismissible = _b.dismissible;
|
|
52
|
-
return dismissible
|
|
53
|
-
? i5.merge(i4.tuiTypedFromEvent(nativeElement, "click").pipe(operators.filter(i4.tuiIsCurrentTarget)), i4.tuiTypedFromEvent(documentRef, "keydown").pipe(operators.filter(function (event) {
|
|
54
|
-
var key = event.key;
|
|
55
|
-
var target = i4.tuiGetActualTarget(event);
|
|
56
|
-
return (key === "Escape" &&
|
|
57
|
-
i4.tuiIsElement(target) &&
|
|
58
|
-
(!i4.tuiContainsOrAfter(nativeElement, target) ||
|
|
59
|
-
nativeElement.contains(target)));
|
|
60
|
-
})), i4.tuiTypedFromEvent(documentRef, "mousedown").pipe(operators.filter(function (event) {
|
|
61
|
-
var target = i4.tuiGetActualTarget(event);
|
|
62
|
-
var clientX = event.clientX;
|
|
63
|
-
return (i4.tuiIsElement(target) &&
|
|
64
|
-
dom.tuiGetViewportWidth(windowRef) - clientX >
|
|
65
|
-
SCROLLBAR_PLACEHOLDER &&
|
|
66
|
-
!i4.tuiContainsOrAfter(nativeElement, target));
|
|
67
|
-
}), operators.switchMap(function () { return i4.tuiTypedFromEvent(documentRef, "mouseup").pipe(operators.take(1), operators.filter(function (event) {
|
|
68
|
-
var target = i4.tuiGetActualTarget(event);
|
|
69
|
-
return (i4.tuiIsElement(target) &&
|
|
70
|
-
!i4.tuiContainsOrAfter(nativeElement, target));
|
|
71
|
-
})); })), close$).pipe(operators.takeUntil(destroy$))
|
|
72
|
-
: close$;
|
|
73
|
-
},
|
|
74
|
-
},
|
|
75
|
-
];
|
|
76
|
-
|
|
77
|
-
var REQUIRED_ERROR = new Error('Required dialog was dismissed');
|
|
78
|
-
var TuiDialogComponent = /** @class */ (function () {
|
|
79
|
-
function TuiDialogComponent(duration, isMobile, context, close$, closeWord$) {
|
|
80
|
-
var _this = this;
|
|
81
|
-
this.duration = duration;
|
|
82
|
-
this.isMobile = isMobile;
|
|
83
|
-
this.context = context;
|
|
84
|
-
this.closeWord$ = closeWord$;
|
|
85
|
-
this.animation = {
|
|
86
|
-
value: '',
|
|
87
|
-
params: {
|
|
88
|
-
start: '40px',
|
|
89
|
-
duration: this.duration,
|
|
90
|
-
},
|
|
91
|
-
};
|
|
92
|
-
this.fullscreenAnimation = {
|
|
93
|
-
value: '',
|
|
94
|
-
params: {
|
|
95
|
-
start: '100vh',
|
|
96
|
-
duration: this.duration,
|
|
97
|
-
},
|
|
98
|
-
};
|
|
99
|
-
close$.subscribe(function () {
|
|
100
|
-
_this.close();
|
|
101
|
-
});
|
|
102
|
-
}
|
|
103
|
-
Object.defineProperty(TuiDialogComponent.prototype, "size", {
|
|
104
|
-
get: function () {
|
|
105
|
-
return this.context.size;
|
|
106
|
-
},
|
|
107
|
-
enumerable: false,
|
|
108
|
-
configurable: true
|
|
109
|
-
});
|
|
110
|
-
Object.defineProperty(TuiDialogComponent.prototype, "header", {
|
|
111
|
-
get: function () {
|
|
112
|
-
return this.context.header;
|
|
113
|
-
},
|
|
114
|
-
enumerable: false,
|
|
115
|
-
configurable: true
|
|
116
|
-
});
|
|
117
|
-
Object.defineProperty(TuiDialogComponent.prototype, "slideInTop", {
|
|
118
|
-
get: function () {
|
|
119
|
-
return this.size === 'fullscreen' || this.size === 'page' || this.isMobile
|
|
120
|
-
? this.fullscreenAnimation
|
|
121
|
-
: this.animation;
|
|
122
|
-
},
|
|
123
|
-
enumerable: false,
|
|
124
|
-
configurable: true
|
|
125
|
-
});
|
|
126
|
-
TuiDialogComponent.prototype.close = function () {
|
|
127
|
-
if (this.context.required) {
|
|
128
|
-
this.context.$implicit.error(REQUIRED_ERROR);
|
|
129
|
-
}
|
|
130
|
-
else {
|
|
131
|
-
this.context.$implicit.complete();
|
|
132
|
-
}
|
|
43
|
+
var TUI_DIALOG_OPTIONS = new i0.InjectionToken("[TUI_DIALOG_OPTIONS]: Default parameters for dialog component", {
|
|
44
|
+
factory: function () { return TUI_DIALOG_DEFAULT_OPTIONS; },
|
|
45
|
+
});
|
|
46
|
+
function tuiDialogOptionsProvider(options) {
|
|
47
|
+
return {
|
|
48
|
+
provide: TUI_DIALOG_OPTIONS,
|
|
49
|
+
useValue: Object.assign(Object.assign({}, TUI_DIALOG_DEFAULT_OPTIONS), options),
|
|
133
50
|
};
|
|
134
|
-
|
|
135
|
-
}());
|
|
136
|
-
TuiDialogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDialogComponent, deps: [{ token: tokens.TUI_ANIMATIONS_DURATION }, { token: i4.TUI_IS_MOBILE }, { token: i3.POLYMORPHEUS_CONTEXT }, { token: TUI_DIALOG_CLOSE_STREAM }, { token: tokens.TUI_CLOSE_WORD }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
137
|
-
TuiDialogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDialogComponent, selector: "tui-dialog", host: { properties: { "attr.data-size": "this.size", "class._centered": "this.header", "@tuiSlideInTop": "this.slideInTop", "@tuiFadeIn": "this.slideInTop" } }, providers: TUI_DIALOG_PROVIDERS, ngImport: i0__namespace, template: "<header\n *ngIf=\"header\"\n class=\"t-header\"\n>\n <ng-container *polymorpheusOutlet=\"header as text; context: context\">\n {{ text }}\n </ng-container>\n</header>\n<div class=\"t-content\">\n <h2\n class=\"t-heading\"\n [id]=\"context.id\"\n [textContent]=\"context.label\"\n ></h2>\n <section>\n <!-- TODO: Polymorpheus fix type -->\n <ng-container *polymorpheusOutlet=\"$any(context.content) as text; context: context\">\n {{ text }}\n <div class=\"t-buttons\">\n <button\n type=\"button\"\n tuiButton\n size=\"m\"\n (click)=\"context.$implicit.complete()\"\n >\n {{ $any(context.data)?.button || 'OK' }}\n </button>\n </div>\n </ng-container>\n </section>\n</div>\n<div\n *ngIf=\"context.closeable\"\n class=\"t-wrapper\"\n>\n <button\n type=\"button\"\n tuiIconButton\n tuiPreventDefault=\"mousedown\"\n automation-id=\"tui-dialog__close\"\n size=\"s\"\n appearance=\"\"\n icon=\"tuiIconCloseLarge\"\n shape=\"rounded\"\n class=\"t-close\"\n [title]=\"closeWord$ | async\"\n (click)=\"close()\"\n ></button>\n</div>\n", styles: [":host{position:relative;display:flex;font:var(--tui-font-text-m);flex-direction:column;box-sizing:border-box;margin:auto;border-radius:1rem;border:2.5rem solid transparent}:host:after{position:absolute;top:0;left:0;width:100%;height:100%;box-shadow:0 1.125rem 1.875rem rgba(0,0,0,.48);content:\"\";border-radius:inherit;pointer-events:none}:host[data-size=auto]{width:auto}:host[data-size=s]{width:30rem}:host[data-size=s] .t-content{padding:1.5rem}:host[data-size=s] .t-heading{margin-bottom:.5rem;font:var(--tui-font-heading-5)}:host[data-size=m]{width:42.5rem}:host[data-size=m] .t-heading{margin-bottom:.75rem;font:var(--tui-font-heading-4)}:host[data-size=l]{width:55rem}:host[data-size=l] .t-heading{margin-bottom:1rem}:host[data-size=fullscreen],:host[data-size=page]{width:100%;min-height:100%;border-radius:0;border:none;background:var(--tui-elevation-01);box-shadow:0 4rem var(--tui-elevation-01)}:host[data-size=fullscreen] .t-content,:host[data-size=page] .t-content{padding:3rem calc(50vw - (45rem / 2))}:host[data-size=fullscreen] .t-heading,:host[data-size=page] .t-heading{margin-bottom:1rem}:host[data-size=page] .t-content{padding:0}:host._centered{text-align:center}:host :host-context(tui-root._mobile)[data-size]{min-width:100%;width:100%;max-width:100%;border-radius:0;border:none;margin:auto 0 0}:host :host-context(tui-root._mobile)[data-size] .t-content{padding:1.5rem}:host :host-context(tui-root._mobile)[data-size] .t-heading{margin-bottom:.5rem;font:var(--tui-font-heading-5)}.t-heading{margin:0;word-wrap:break-word;font:var(--tui-font-heading-3)}.t-heading:empty{display:none}.t-header{display:flex;border-top-left-radius:inherit;border-top-right-radius:inherit;overflow:hidden}:host[data-size=fullscreen] :host-context(tui-root._mobile) .t-header{flex:1}.t-content{border-radius:inherit;padding:2rem;background:var(--tui-base-01)}.t-content:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.t-wrapper{position:-webkit-sticky;position:sticky;top:0;order:-1}.t-close{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:fixed;top:1.5rem;right:1.5rem;color:var(--tui-base-01);background:rgba(104,104,104,.96)}.t-close:hover{background:rgba(159,159,159,.86)}:host:not([data-size=\"fullscreen\"]) .t-close{animation:tuiFadeIn var(--tui-duration)}:host:not([data-size=\"fullscreen\"]).ng-animating .t-close{display:none}:host-context(tui-root._mobile) .t-close{position:absolute;top:0;right:0;background:transparent;color:var(--tui-base-06)}:host-context(tui-root._mobile) .t-close:hover{color:var(--tui-base-07)}.t-buttons{margin-top:1.25rem;text-align:right}\n"], components: [{ type: i1__namespace.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i4__namespace.TuiPreventDefaultDirective, selector: "[tuiPreventDefault]", inputs: ["tuiPreventDefault"] }], pipes: { "async": i2__namespace.AsyncPipe }, animations: [animations.tuiSlideInTop, animations.tuiFadeIn], changeDetection: i0__namespace.ChangeDetectionStrategy.Default });
|
|
138
|
-
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDialogComponent, decorators: [{
|
|
139
|
-
type: i0.Component,
|
|
140
|
-
args: [{
|
|
141
|
-
selector: 'tui-dialog',
|
|
142
|
-
templateUrl: './dialog.template.html',
|
|
143
|
-
styleUrls: ['./dialog.style.less'],
|
|
144
|
-
// So we don't force OnPush on dialog content
|
|
145
|
-
// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection
|
|
146
|
-
changeDetection: i0.ChangeDetectionStrategy.Default,
|
|
147
|
-
providers: TUI_DIALOG_PROVIDERS,
|
|
148
|
-
animations: [animations.tuiSlideInTop, animations.tuiFadeIn],
|
|
149
|
-
}]
|
|
150
|
-
}], ctorParameters: function () {
|
|
151
|
-
return [{ type: undefined, decorators: [{
|
|
152
|
-
type: i0.Inject,
|
|
153
|
-
args: [tokens.TUI_ANIMATIONS_DURATION]
|
|
154
|
-
}] }, { type: undefined, decorators: [{
|
|
155
|
-
type: i0.Inject,
|
|
156
|
-
args: [i4.TUI_IS_MOBILE]
|
|
157
|
-
}] }, { type: undefined, decorators: [{
|
|
158
|
-
type: i0.Inject,
|
|
159
|
-
args: [i3.POLYMORPHEUS_CONTEXT]
|
|
160
|
-
}] }, { type: i5__namespace.Observable, decorators: [{
|
|
161
|
-
type: i0.Inject,
|
|
162
|
-
args: [TUI_DIALOG_CLOSE_STREAM]
|
|
163
|
-
}] }, { type: i5__namespace.Observable, decorators: [{
|
|
164
|
-
type: i0.Inject,
|
|
165
|
-
args: [tokens.TUI_CLOSE_WORD]
|
|
166
|
-
}] }];
|
|
167
|
-
}, propDecorators: { size: [{
|
|
168
|
-
type: i0.HostBinding,
|
|
169
|
-
args: ['attr.data-size']
|
|
170
|
-
}], header: [{
|
|
171
|
-
type: i0.HostBinding,
|
|
172
|
-
args: ['class._centered']
|
|
173
|
-
}], slideInTop: [{
|
|
174
|
-
type: i0.HostBinding,
|
|
175
|
-
args: ['@tuiSlideInTop']
|
|
176
|
-
}, {
|
|
177
|
-
type: i0.HostBinding,
|
|
178
|
-
args: ['@tuiFadeIn']
|
|
179
|
-
}] } });
|
|
51
|
+
}
|
|
180
52
|
|
|
181
53
|
/******************************************************************************
|
|
182
54
|
Copyright (c) Microsoft Corporation.
|
|
@@ -505,23 +377,174 @@
|
|
|
505
377
|
return typeof state === "function" ? receiver === state : state.has(receiver);
|
|
506
378
|
}
|
|
507
379
|
|
|
508
|
-
var
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
380
|
+
var SCROLLBAR_PLACEHOLDER = 17;
|
|
381
|
+
var TuiDialogCloseService = /** @class */ (function (_super) {
|
|
382
|
+
__extends(TuiDialogCloseService, _super);
|
|
383
|
+
function TuiDialogCloseService(windowRef, documentRef, elementRef) {
|
|
384
|
+
var _this = _super.call(this, function (subscriber) { return i5.merge(_this.click$, _this.esc$, _this.mousedown$).subscribe(subscriber); }) || this;
|
|
385
|
+
_this.windowRef = windowRef;
|
|
386
|
+
_this.documentRef = documentRef;
|
|
387
|
+
_this.elementRef = elementRef;
|
|
388
|
+
_this.click$ = i4.tuiTypedFromEvent(_this.element, "click").pipe(operators.filter(i4.tuiIsCurrentTarget));
|
|
389
|
+
_this.esc$ = i4.tuiTypedFromEvent(_this.documentRef, "keydown").pipe(operators.filter(function (event) {
|
|
390
|
+
var key = event.key;
|
|
391
|
+
var target = i4.tuiGetActualTarget(event);
|
|
392
|
+
return (key === "Escape" &&
|
|
393
|
+
i4.tuiIsElement(target) &&
|
|
394
|
+
(_this.element.contains(target) ||
|
|
395
|
+
!i4.tuiContainsOrAfter(_this.element, target)));
|
|
396
|
+
}));
|
|
397
|
+
_this.mousedown$ = i4.tuiTypedFromEvent(_this.documentRef, "mousedown").pipe(operators.filter(function (event) {
|
|
398
|
+
var target = i4.tuiGetActualTarget(event);
|
|
399
|
+
var clientX = event.clientX;
|
|
400
|
+
return (i4.tuiIsElement(target) &&
|
|
401
|
+
utils.tuiGetViewportWidth(_this.windowRef) - clientX > SCROLLBAR_PLACEHOLDER &&
|
|
402
|
+
!i4.tuiContainsOrAfter(_this.element, target));
|
|
403
|
+
}), operators.switchMap(function () { return i4.tuiTypedFromEvent(_this.documentRef, "mouseup").pipe(operators.take(1), operators.map(i4.tuiGetActualTarget), operators.filter(function (target) { return i4.tuiIsElement(target) && !i4.tuiContainsOrAfter(_this.element, target); })); }));
|
|
404
|
+
return _this;
|
|
405
|
+
}
|
|
406
|
+
Object.defineProperty(TuiDialogCloseService.prototype, "element", {
|
|
407
|
+
get: function () {
|
|
408
|
+
return this.elementRef.nativeElement;
|
|
409
|
+
},
|
|
410
|
+
enumerable: false,
|
|
411
|
+
configurable: true
|
|
412
|
+
});
|
|
413
|
+
return TuiDialogCloseService;
|
|
414
|
+
}(i5.Observable));
|
|
415
|
+
TuiDialogCloseService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDialogCloseService, deps: [{ token: common.WINDOW }, { token: i2.DOCUMENT }, { token: i0.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
|
|
416
|
+
TuiDialogCloseService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDialogCloseService });
|
|
417
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDialogCloseService, decorators: [{
|
|
418
|
+
type: i0.Injectable
|
|
419
|
+
}], ctorParameters: function () {
|
|
420
|
+
return [{ type: Window, decorators: [{
|
|
421
|
+
type: i0.Inject,
|
|
422
|
+
args: [common.WINDOW]
|
|
423
|
+
}] }, { type: Document, decorators: [{
|
|
424
|
+
type: i0.Inject,
|
|
425
|
+
args: [i2.DOCUMENT]
|
|
426
|
+
}] }, { type: i0__namespace.ElementRef, decorators: [{
|
|
427
|
+
type: i0.Inject,
|
|
428
|
+
args: [i0.ElementRef]
|
|
429
|
+
}] }];
|
|
430
|
+
} });
|
|
431
|
+
|
|
432
|
+
var REQUIRED_ERROR = new Error('Required dialog was dismissed');
|
|
433
|
+
var TuiDialogComponent = /** @class */ (function () {
|
|
434
|
+
function TuiDialogComponent(duration, isMobile, context, destroy$, dialogClose$, close$, closeWord$) {
|
|
435
|
+
var _this = this;
|
|
436
|
+
this.duration = duration;
|
|
437
|
+
this.isMobile = isMobile;
|
|
438
|
+
this.context = context;
|
|
439
|
+
this.closeWord$ = closeWord$;
|
|
440
|
+
this.animation = {
|
|
441
|
+
value: '',
|
|
442
|
+
params: {
|
|
443
|
+
start: '40px',
|
|
444
|
+
duration: this.duration,
|
|
445
|
+
},
|
|
446
|
+
};
|
|
447
|
+
this.fullscreenAnimation = {
|
|
448
|
+
value: '',
|
|
449
|
+
params: {
|
|
450
|
+
start: '100vh',
|
|
451
|
+
duration: this.duration,
|
|
452
|
+
},
|
|
453
|
+
};
|
|
454
|
+
this.close$ = new i5.Subject();
|
|
455
|
+
i5.merge(i5.merge(dialogClose$, this.close$).pipe(operators.switchMap(function () { return i5.isObservable(context.closeable)
|
|
456
|
+
? context.closeable
|
|
457
|
+
: i5.of(context.closeable); }), operators.filter(Boolean)), close$)
|
|
458
|
+
.pipe(operators.takeUntil(destroy$))
|
|
459
|
+
.subscribe(function () {
|
|
460
|
+
_this.close();
|
|
461
|
+
});
|
|
462
|
+
}
|
|
463
|
+
Object.defineProperty(TuiDialogComponent.prototype, "size", {
|
|
464
|
+
get: function () {
|
|
465
|
+
return this.context.size;
|
|
466
|
+
},
|
|
467
|
+
enumerable: false,
|
|
468
|
+
configurable: true
|
|
469
|
+
});
|
|
470
|
+
Object.defineProperty(TuiDialogComponent.prototype, "header", {
|
|
471
|
+
get: function () {
|
|
472
|
+
return this.context.header;
|
|
473
|
+
},
|
|
474
|
+
enumerable: false,
|
|
475
|
+
configurable: true
|
|
476
|
+
});
|
|
477
|
+
Object.defineProperty(TuiDialogComponent.prototype, "slideInTop", {
|
|
478
|
+
get: function () {
|
|
479
|
+
return this.size === 'fullscreen' || this.size === 'page' || this.isMobile
|
|
480
|
+
? this.fullscreenAnimation
|
|
481
|
+
: this.animation;
|
|
482
|
+
},
|
|
483
|
+
enumerable: false,
|
|
484
|
+
configurable: true
|
|
485
|
+
});
|
|
486
|
+
TuiDialogComponent.prototype.close = function () {
|
|
487
|
+
if (this.context.required) {
|
|
488
|
+
this.context.$implicit.error(REQUIRED_ERROR);
|
|
489
|
+
}
|
|
490
|
+
else {
|
|
491
|
+
this.context.$implicit.complete();
|
|
492
|
+
}
|
|
523
493
|
};
|
|
524
|
-
|
|
494
|
+
return TuiDialogComponent;
|
|
495
|
+
}());
|
|
496
|
+
TuiDialogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDialogComponent, deps: [{ token: tokens.TUI_ANIMATIONS_DURATION }, { token: i4.TUI_IS_MOBILE }, { token: i3.POLYMORPHEUS_CONTEXT }, { token: i4.TuiDestroyService, self: true }, { token: TuiDialogCloseService }, { token: TUI_DIALOGS_CLOSE }, { token: tokens.TUI_CLOSE_WORD }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
497
|
+
TuiDialogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDialogComponent, selector: "tui-dialog", host: { properties: { "attr.data-size": "this.size", "class._centered": "this.header", "@tuiSlideInTop": "this.slideInTop", "@tuiFadeIn": "this.slideInTop" } }, providers: [i4.TuiDestroyService, TuiDialogCloseService], ngImport: i0__namespace, template: "<header\n *ngIf=\"header\"\n class=\"t-header\"\n>\n <ng-container *polymorpheusOutlet=\"header as text; context: context\">\n {{ text }}\n </ng-container>\n</header>\n<div class=\"t-content\">\n <h2\n class=\"t-heading\"\n [id]=\"context.id\"\n [textContent]=\"context.label\"\n ></h2>\n <section>\n <!-- TODO: Polymorpheus fix type -->\n <ng-container *polymorpheusOutlet=\"$any(context.content) as text; context: context\">\n {{ text }}\n <div class=\"t-buttons\">\n <button\n type=\"button\"\n tuiButton\n size=\"m\"\n (click)=\"context.$implicit.complete()\"\n >\n {{ $any(context.data)?.button || 'OK' }}\n </button>\n </div>\n </ng-container>\n </section>\n</div>\n<div\n *ngIf=\"context.closeable\"\n class=\"t-wrapper\"\n>\n <button\n type=\"button\"\n tuiIconButton\n tuiPreventDefault=\"mousedown\"\n automation-id=\"tui-dialog__close\"\n size=\"s\"\n appearance=\"\"\n icon=\"tuiIconCloseLarge\"\n shape=\"rounded\"\n class=\"t-close\"\n [title]=\"closeWord$ | async\"\n (click)=\"close$.next()\"\n ></button>\n</div>\n", styles: [":host{position:relative;display:flex;font:var(--tui-font-text-m);flex-direction:column;box-sizing:border-box;margin:auto;border-radius:1rem;border:2.5rem solid transparent}:host:after{position:absolute;top:0;left:0;width:100%;height:100%;box-shadow:0 1.125rem 1.875rem rgba(0,0,0,.48);content:\"\";border-radius:inherit;pointer-events:none}:host[data-size=auto]{width:auto}:host[data-size=s]{width:30rem}:host[data-size=s] .t-content{padding:1.5rem}:host[data-size=s] .t-heading{margin-bottom:.5rem;font:var(--tui-font-heading-5)}:host[data-size=m]{width:42.5rem}:host[data-size=m] .t-heading{margin-bottom:.75rem;font:var(--tui-font-heading-4)}:host[data-size=l]{width:55rem}:host[data-size=l] .t-heading{margin-bottom:1rem}:host[data-size=fullscreen],:host[data-size=page]{width:100%;min-height:100%;border-radius:0;border:none;background:var(--tui-elevation-01);box-shadow:0 4rem var(--tui-elevation-01)}:host[data-size=fullscreen] .t-content,:host[data-size=page] .t-content{padding:3rem calc(50vw - (45rem / 2))}:host[data-size=fullscreen] .t-heading,:host[data-size=page] .t-heading{margin-bottom:1rem}:host[data-size=page] .t-content{padding:0}:host._centered{text-align:center}:host :host-context(tui-root._mobile)[data-size]{min-width:100%;width:100%;max-width:100%;border-radius:0;border:none;margin:auto 0 0}:host :host-context(tui-root._mobile)[data-size] .t-content{padding:1.5rem}:host :host-context(tui-root._mobile)[data-size] .t-heading{margin-bottom:.5rem;font:var(--tui-font-heading-5)}.t-heading{margin:0;word-wrap:break-word;font:var(--tui-font-heading-3)}.t-heading:empty{display:none}.t-header{display:flex;border-top-left-radius:inherit;border-top-right-radius:inherit;overflow:hidden}:host[data-size=fullscreen] :host-context(tui-root._mobile) .t-header{flex:1}.t-content{border-radius:inherit;padding:2rem;background:var(--tui-base-01)}.t-content:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.t-wrapper{position:-webkit-sticky;position:sticky;top:0;order:-1}.t-close{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:fixed;top:1.5rem;right:1.5rem;color:var(--tui-base-01);background:rgba(104,104,104,.96)}.t-close:hover{background:rgba(159,159,159,.86)}:host:not([data-size=\"fullscreen\"]) .t-close{animation:tuiFadeIn var(--tui-duration)}:host:not([data-size=\"fullscreen\"]).ng-animating .t-close{display:none}:host-context(tui-root._mobile) .t-close{position:absolute;top:0;right:0;background:transparent;color:var(--tui-base-06)}:host-context(tui-root._mobile) .t-close:hover{color:var(--tui-base-07)}.t-buttons{margin-top:1.25rem;text-align:right}\n"], components: [{ type: i1__namespace.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i4__namespace.TuiPreventDefaultDirective, selector: "[tuiPreventDefault]", inputs: ["tuiPreventDefault"] }], pipes: { "async": i2__namespace.AsyncPipe }, animations: [animations.tuiSlideInTop, animations.tuiFadeIn], changeDetection: i0__namespace.ChangeDetectionStrategy.Default });
|
|
498
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDialogComponent, decorators: [{
|
|
499
|
+
type: i0.Component,
|
|
500
|
+
args: [{
|
|
501
|
+
selector: 'tui-dialog',
|
|
502
|
+
templateUrl: './dialog.template.html',
|
|
503
|
+
styleUrls: ['./dialog.style.less'],
|
|
504
|
+
// So we don't force OnPush on dialog content
|
|
505
|
+
// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection
|
|
506
|
+
changeDetection: i0.ChangeDetectionStrategy.Default,
|
|
507
|
+
providers: [i4.TuiDestroyService, TuiDialogCloseService],
|
|
508
|
+
animations: [animations.tuiSlideInTop, animations.tuiFadeIn],
|
|
509
|
+
}]
|
|
510
|
+
}], ctorParameters: function () {
|
|
511
|
+
return [{ type: undefined, decorators: [{
|
|
512
|
+
type: i0.Inject,
|
|
513
|
+
args: [tokens.TUI_ANIMATIONS_DURATION]
|
|
514
|
+
}] }, { type: undefined, decorators: [{
|
|
515
|
+
type: i0.Inject,
|
|
516
|
+
args: [i4.TUI_IS_MOBILE]
|
|
517
|
+
}] }, { type: undefined, decorators: [{
|
|
518
|
+
type: i0.Inject,
|
|
519
|
+
args: [i3.POLYMORPHEUS_CONTEXT]
|
|
520
|
+
}] }, { type: i5__namespace.Observable, decorators: [{
|
|
521
|
+
type: i0.Inject,
|
|
522
|
+
args: [i4.TuiDestroyService]
|
|
523
|
+
}, {
|
|
524
|
+
type: i0.Self
|
|
525
|
+
}] }, { type: i5__namespace.Observable, decorators: [{
|
|
526
|
+
type: i0.Inject,
|
|
527
|
+
args: [TuiDialogCloseService]
|
|
528
|
+
}] }, { type: i5__namespace.Observable, decorators: [{
|
|
529
|
+
type: i0.Inject,
|
|
530
|
+
args: [TUI_DIALOGS_CLOSE]
|
|
531
|
+
}] }, { type: i5__namespace.Observable, decorators: [{
|
|
532
|
+
type: i0.Inject,
|
|
533
|
+
args: [tokens.TUI_CLOSE_WORD]
|
|
534
|
+
}] }];
|
|
535
|
+
}, propDecorators: { size: [{
|
|
536
|
+
type: i0.HostBinding,
|
|
537
|
+
args: ['attr.data-size']
|
|
538
|
+
}], header: [{
|
|
539
|
+
type: i0.HostBinding,
|
|
540
|
+
args: ['class._centered']
|
|
541
|
+
}], slideInTop: [{
|
|
542
|
+
type: i0.HostBinding,
|
|
543
|
+
args: ['@tuiSlideInTop']
|
|
544
|
+
}, {
|
|
545
|
+
type: i0.HostBinding,
|
|
546
|
+
args: ['@tuiFadeIn']
|
|
547
|
+
}] } });
|
|
525
548
|
|
|
526
549
|
var DIALOG = new i3.PolymorpheusComponent(TuiDialogComponent);
|
|
527
550
|
var TuiDialogService = /** @class */ (function (_super) {
|
|
@@ -595,10 +618,9 @@
|
|
|
595
618
|
*/
|
|
596
619
|
|
|
597
620
|
exports.TUI_DIALOGS_CLOSE = TUI_DIALOGS_CLOSE;
|
|
598
|
-
exports.TUI_DIALOG_CLOSE_STREAM = TUI_DIALOG_CLOSE_STREAM;
|
|
599
621
|
exports.TUI_DIALOG_DEFAULT_OPTIONS = TUI_DIALOG_DEFAULT_OPTIONS;
|
|
600
622
|
exports.TUI_DIALOG_OPTIONS = TUI_DIALOG_OPTIONS;
|
|
601
|
-
exports.
|
|
623
|
+
exports.TuiDialogCloseService = TuiDialogCloseService;
|
|
602
624
|
exports.TuiDialogComponent = TuiDialogComponent;
|
|
603
625
|
exports.TuiDialogDirective = TuiDialogDirective;
|
|
604
626
|
exports.TuiDialogModule = TuiDialogModule;
|