@taiga-ui/addon-mobile 4.52.0-canary.c107f6a → 4.52.0-canary.c8448e0

package/fesm2022/taiga-ui-addon-mobile-directives-ripple.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-addon-mobile-directives-ripple.mjs","sources":["../../../projects/addon-mobile/directives/ripple/ripple.directive.ts","../../../projects/addon-mobile/directives/ripple/taiga-ui-addon-mobile-directives-ripple.ts"],"sourcesContent":["import {DOCUMENT} from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    DestroyRef,\n    Directive,\n    inject,\n    Input,\n    ViewEncapsulation,\n} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {tuiIsHTMLElement} from '@taiga-ui/cdk/utils/dom';\nimport {tuiPx, tuiWithStyles} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TUI_ANIMATIONS_SPEED} from '@taiga-ui/core/tokens';\nimport {tuiGetDuration} from '@taiga-ui/core/utils/miscellaneous';\nimport {first, fromEvent, merge, race, switchMap, tap} from 'rxjs';\n\nconst TO = [{transform: 'scale(0)', opacity: '0.12'}, {opacity: '0.12'}];\nconst FROM = [{opacity: '0.12'}, {opacity: '0'}];\n\n@Component({\n    template: '',\n    styleUrl: './ripple.style.less',\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {class: 'tui-ripple'},\n})\nclass Styles {}\n\n@Directive({\n    selector: '[tuiRipple]',\n    host: {\n        '(pointerdown.zoneless)':\n            'start($event.clientX, $event.clientY, $event.target, $event.currentTarget)',\n    },\n})\nexport class TuiRipple {\n    private readonly doc = inject(DOCUMENT);\n    private readonly destroyRef = inject(DestroyRef);\n    private readonly duration = tuiGetDuration(inject(TUI_ANIMATIONS_SPEED));\n\n    protected readonly nothing = tuiWithStyles(Styles);\n\n    @Input()\n    public tuiRipple = '';\n\n    protected start(x: number, y: number, target: HTMLElement, el: HTMLElement): void {\n        const element = this.tuiRipple ? target.closest(this.tuiRipple) : el;\n\n        if (!tuiIsHTMLElement(element)) {\n            return;\n        }\n\n        const ripple = this.createRipple(x, y, element.getBoundingClientRect());\n        const touchEnd$ = merge(\n            fromEvent(element, 'pointerup'),\n            fromEvent(element, 'pointercancel'),\n            fromEvent(element, 'pointermove'),\n        );\n\n        element.appendChild(ripple);\n\n        const animationEnd$ = fromEvent(ripple.animate(TO, this.duration), 'finish');\n\n        race(\n            touchEnd$.pipe(switchMap(() => animationEnd$)),\n            animationEnd$.pipe(switchMap(() => touchEnd$)),\n        )\n            .pipe(\n                first(),\n                switchMap(() => fromEvent(ripple.animate(FROM, this.duration), 'finish')),\n                first(),\n                tap(() => element.removeChild(ripple)),\n                takeUntilDestroyed(this.destroyRef),\n            )\n            .subscribe();\n    }\n\n    private createRipple(\n        clientX: number,\n        clientY: number,\n        {width, height, top, left}: DOMRect,\n    ): HTMLElement {\n        const ripple: HTMLElement = this.doc.createElement('div');\n        const radius = Math.sqrt(width * width + height * height);\n        const dimension = radius * 2;\n        const x = clientX - left - radius;\n        const y = clientY - top - radius;\n\n        Object.assign(ripple.style, {\n            position: 'absolute',\n            top: tuiPx(y),\n            left: tuiPx(x),\n            width: tuiPx(dimension),\n            height: tuiPx(dimension),\n            zIndex: 100,\n            opacity: 0.12,\n            borderRadius: '100%',\n            background: 'var(--tui-ripple-background, currentColor)',\n            animationFillMode: 'forwards',\n            pointerEvents: 'none',\n        });\n\n        return ripple;\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"taiga-ui-addon-mobile-directives-ripple.mjs","sources":["../../../projects/addon-mobile/directives/ripple/ripple.directive.ts","../../../projects/addon-mobile/directives/ripple/taiga-ui-addon-mobile-directives-ripple.ts"],"sourcesContent":["import {DOCUMENT} from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    DestroyRef,\n    Directive,\n    inject,\n    input,\n    ViewEncapsulation,\n} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {tuiIsHTMLElement} from '@taiga-ui/cdk/utils/dom';\nimport {tuiPx, tuiWithStyles} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TUI_ANIMATIONS_SPEED} from '@taiga-ui/core/tokens';\nimport {tuiGetDuration} from '@taiga-ui/core/utils/miscellaneous';\nimport {first, fromEvent, merge, race, switchMap, tap} from 'rxjs';\n\nconst TO = [{transform: 'scale(0)', opacity: '0.12'}, {opacity: '0.12'}];\nconst FROM = [{opacity: '0.12'}, {opacity: '0'}];\n\n@Component({\n    template: '',\n    styleUrl: './ripple.style.less',\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {class: 'tui-ripple'},\n})\nclass Styles {}\n\n@Directive({\n    selector: '[tuiRipple]',\n    host: {\n        '(pointerdown.zoneless)':\n            'start($event.clientX, $event.clientY, $event.target, $event.currentTarget)',\n    },\n})\nexport class TuiRipple {\n    private readonly doc = inject(DOCUMENT);\n    private readonly destroyRef = inject(DestroyRef);\n    private readonly duration = tuiGetDuration(inject(TUI_ANIMATIONS_SPEED));\n\n    protected readonly nothing = tuiWithStyles(Styles);\n\n    public readonly tuiRipple = input('');\n\n    protected start(x: number, y: number, target: HTMLElement, el: HTMLElement): void {\n        const element = this.tuiRipple() ? target.closest(this.tuiRipple()) : el;\n\n        if (!tuiIsHTMLElement(element)) {\n            return;\n        }\n\n        const ripple = this.createRipple(x, y, element.getBoundingClientRect());\n        const touchEnd$ = merge(\n            fromEvent(element, 'pointerup'),\n            fromEvent(element, 'pointercancel'),\n            fromEvent(element, 'pointermove'),\n        );\n\n        element.appendChild(ripple);\n\n        const animationEnd$ = fromEvent(ripple.animate(TO, this.duration), 'finish');\n\n        race(\n            touchEnd$.pipe(switchMap(() => animationEnd$)),\n            animationEnd$.pipe(switchMap(() => touchEnd$)),\n        )\n            .pipe(\n                first(),\n                switchMap(() => fromEvent(ripple.animate(FROM, this.duration), 'finish')),\n                first(),\n                tap(() => element.removeChild(ripple)),\n                takeUntilDestroyed(this.destroyRef),\n            )\n            .subscribe();\n    }\n\n    private createRipple(\n        clientX: number,\n        clientY: number,\n        {width, height, top, left}: DOMRect,\n    ): HTMLElement {\n        const ripple: HTMLElement = this.doc.createElement('div');\n        const radius = Math.sqrt(width * width + height * height);\n        const dimension = radius * 2;\n        const x = clientX - left - radius;\n        const y = clientY - top - radius;\n\n        Object.assign(ripple.style, {\n            position: 'absolute',\n            top: tuiPx(y),\n            left: tuiPx(x),\n            width: tuiPx(dimension),\n            height: tuiPx(dimension),\n            zIndex: 100,\n            opacity: 0.12,\n            borderRadius: '100%',\n            background: 'var(--tui-ripple-background, currentColor)',\n            animationFillMode: 'forwards',\n            pointerEvents: 'none',\n        });\n\n        return ripple;\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/taiga-ui-addon-mobile-directives-touchable.mjs

@@ -1,5 +1,6 @@
+import { DOCUMENT } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, Input, Directive } from '@angular/core';
+import { inject, computed, input, Directive } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { tuiTypedFromEvent } from '@taiga-ui/cdk/observables';
 import { TUI_IS_IOS } from '@taiga-ui/cdk/tokens';
@@ -11,7 +12,7 @@ const STYLE = {
     opacity: '0.6',
     background: 'rgba(146, 153, 162, 0.12)',
 };
-function tuiFindTouchIndex(touches, id) {
+function findIndex(touches, id = 0) {
     for (let i = 0; i < touches.length; i++) {
         if (touches[i]?.identifier === id) {
             return i;
@@ -23,54 +24,47 @@ class TuiTouchable {
     constructor() {
         this.isIOS = inject(TUI_IS_IOS);
         this.el = tuiInjectElement();
-        this.tuiTouchable = '';
+        this.doc = inject(DOCUMENT);
+        this.style = computed(() => this.tuiTouchable() || 'transform');
+        this.tuiTouchable = input('');
         if (!this.isIOS) {
             return;
         }
         tuiTypedFromEvent(this.el, 'touchstart', { passive: true })
-            .pipe(tap(() => this.onTouchStart()), map(({ touches }) => touches[touches.length - 1]?.identifier), switchMap((identifier) => race(tuiTypedFromEvent(this.el, 'touchmove', { passive: true }).pipe(filter(({ touches }) => this.hasTouchLeft(this.el, touches, identifier ?? 0))), tuiTypedFromEvent(this.el, 'touchend')).pipe(take(1))), takeUntilDestroyed())
+            .pipe(tap(() => this.onTouchStart()), map(({ touches }) => touches[touches.length - 1]?.identifier), switchMap((id) => race(tuiTypedFromEvent(this.el, 'touchend'), tuiTypedFromEvent(this.el, 'touchmove', { passive: true }).pipe(filter(({ touches }) => this.hasTouches(this.el, touches, id)))).pipe(take(1))), takeUntilDestroyed())
             .subscribe(() => {
             this.el.style.removeProperty('transform');
             this.el.style.removeProperty('opacity');
             this.el.style.removeProperty('background');
         });
     }
-    get style() {
-        return this.tuiTouchable || 'transform';
-    }
-    hasTouchLeft(element, touches, identifier) {
-        const { ownerDocument } = element;
-        const id = tuiFindTouchIndex(touches, identifier);
-        if (!ownerDocument || id === -1) {
-            return true;
-        }
-        const { clientX = 0, clientY = 0 } = touches[id] ?? {};
-        return !element.contains(ownerDocument.elementFromPoint(clientX, clientY));
+    hasTouches(el, touches, id) {
+        const index = findIndex(touches, id);
+        const { clientX = 0, clientY = 0 } = touches[index] ?? {};
+        return index === -1 || !el.contains(this.doc.elementFromPoint(clientX, clientY));
     }
     onTouchStart() {
-        if (this.style !== 'transform') {
+        if (this.style() !== 'transform') {
             this.el.style.removeProperty('transition');
         }
         else {
             this.el.style.setProperty('transition', 'transform 0.2s');
         }
-        this.el.style.setProperty(this.style, STYLE[this.style]);
+        this.el.style.setProperty(this.style(), STYLE[this.style()]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiTouchable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiTouchable, isStandalone: true, selector: "[tuiTouchable]", inputs: { tuiTouchable: "tuiTouchable" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTouchable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiTouchable, isStandalone: true, selector: "[tuiTouchable]", inputs: { tuiTouchable: { classPropertyName: "tuiTouchable", publicName: "tuiTouchable", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiTouchable, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTouchable, decorators: [{
             type: Directive,
             args: [{
                     selector: '[tuiTouchable]',
                 }]
-        }], ctorParameters: () => [], propDecorators: { tuiTouchable: [{
-                type: Input
-            }] } });
+        }], ctorParameters: () => [] });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { TuiTouchable, tuiFindTouchIndex };
+export { TuiTouchable };
 //# sourceMappingURL=taiga-ui-addon-mobile-directives-touchable.mjs.map

package/fesm2022/taiga-ui-addon-mobile-directives-touchable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-addon-mobile-directives-touchable.mjs","sources":["../../../projects/addon-mobile/directives/touchable/touchable.directive.ts","../../../projects/addon-mobile/directives/touchable/taiga-ui-addon-mobile-directives-touchable.ts"],"sourcesContent":["import {Directive, inject, Input} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {tuiTypedFromEvent} from '@taiga-ui/cdk/observables';\nimport {TUI_IS_IOS} from '@taiga-ui/cdk/tokens';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {filter, map, race, switchMap, take, tap} from 'rxjs';\n\nconst STYLE = {\n    transform: 'scale(0.95)',\n    opacity: '0.6',\n    background: 'rgba(146, 153, 162, 0.12)',\n} as const;\n\nexport function tuiFindTouchIndex(touches: TouchList, id: number): number {\n    for (let i = 0; i < touches.length; i++) {\n        if (touches[i]?.identifier === id) {\n            return i;\n        }\n    }\n\n    return -1;\n}\n\n@Directive({\n    selector: '[tuiTouchable]',\n})\nexport class TuiTouchable {\n    private readonly isIOS = inject(TUI_IS_IOS);\n    private readonly el = tuiInjectElement();\n\n    @Input()\n    public tuiTouchable: '' | 'background' | 'opacity' | 'transform' = '';\n\n    constructor() {\n        if (!this.isIOS) {\n            return;\n        }\n\n        tuiTypedFromEvent(this.el, 'touchstart', {passive: true})\n            .pipe(\n                tap(() => this.onTouchStart()),\n                map(({touches}) => touches[touches.length - 1]?.identifier),\n                switchMap((identifier) =>\n                    race(\n                        tuiTypedFromEvent(this.el, 'touchmove', {passive: true}).pipe(\n                            filter(({touches}) =>\n                                this.hasTouchLeft(this.el, touches, identifier ?? 0),\n                            ),\n                        ),\n                        tuiTypedFromEvent(this.el, 'touchend'),\n                    ).pipe(take(1)),\n                ),\n                takeUntilDestroyed(),\n            )\n            .subscribe(() => {\n                this.el.style.removeProperty('transform');\n                this.el.style.removeProperty('opacity');\n                this.el.style.removeProperty('background');\n            });\n    }\n\n    protected get style(): 'background' | 'opacity' | 'transform' {\n        return this.tuiTouchable || 'transform';\n    }\n\n    private hasTouchLeft(\n        element: HTMLElement,\n        touches: TouchList,\n        identifier: number,\n    ): boolean {\n        const {ownerDocument} = element;\n        const id = tuiFindTouchIndex(touches, identifier);\n\n        if (!ownerDocument || id === -1) {\n            return true;\n        }\n\n        const {clientX = 0, clientY = 0} = touches[id] ?? {};\n\n        return !element.contains(ownerDocument.elementFromPoint(clientX, clientY));\n    }\n\n    private onTouchStart(): void {\n        if (this.style !== 'transform') {\n            this.el.style.removeProperty('transition');\n        } else {\n            this.el.style.setProperty('transition', 'transform 0.2s');\n        }\n\n        this.el.style.setProperty(this.style, STYLE[this.style]);\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AAOA,MAAM,KAAK,GAAG;AACV,IAAA,SAAS,EAAE,aAAa;AACxB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,UAAU,EAAE,2BAA2B;CACjC;AAEM,SAAA,iBAAiB,CAAC,OAAkB,EAAE,EAAU,EAAA;AAC5D,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACrC,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,UAAU,KAAK,EAAE,EAAE;AAC/B,YAAA,OAAO,CAAC;;;IAIhB,OAAO,CAAC,CAAC;AACb;MAKa,YAAY,CAAA;AAOrB,IAAA,WAAA,GAAA;AANiB,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC;QAC1B,IAAE,CAAA,EAAA,GAAG,gBAAgB,EAAE;QAGjC,IAAY,CAAA,YAAA,GAAgD,EAAE;AAGjE,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACb;;AAGJ,QAAA,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,YAAY,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC;aACnD,IAAI,CACD,GAAG,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC,EAC9B,GAAG,CAAC,CAAC,EAAC,OAAO,EAAC,KAAK,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,UAAU,CAAC,EAC3D,SAAS,CAAC,CAAC,UAAU,KACjB,IAAI,CACA,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,WAAW,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,IAAI,CACzD,MAAM,CAAC,CAAC,EAAC,OAAO,EAAC,KACb,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,EAAE,UAAU,IAAI,CAAC,CAAC,CACvD,CACJ,EACD,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,UAAU,CAAC,CACzC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAClB,EACD,kBAAkB,EAAE;aAEvB,SAAS,CAAC,MAAK;YACZ,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;YACzC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC;YACvC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC;AAC9C,SAAC,CAAC;;AAGV,IAAA,IAAc,KAAK,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,YAAY,IAAI,WAAW;;AAGnC,IAAA,YAAY,CAChB,OAAoB,EACpB,OAAkB,EAClB,UAAkB,EAAA;AAElB,QAAA,MAAM,EAAC,aAAa,EAAC,GAAG,OAAO;QAC/B,MAAM,EAAE,GAAG,iBAAiB,CAAC,OAAO,EAAE,UAAU,CAAC;QAEjD,IAAI,CAAC,aAAa,IAAI,EAAE,KAAK,CAAC,CAAC,EAAE;AAC7B,YAAA,OAAO,IAAI;;AAGf,QAAA,MAAM,EAAC,OAAO,GAAG,CAAC,EAAE,OAAO,GAAG,CAAC,EAAC,GAAG,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE;AAEpD,QAAA,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;;IAGtE,YAAY,GAAA;AAChB,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,WAAW,EAAE;YAC5B,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC;;aACvC;YACH,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,gBAAgB,CAAC;;AAG7D,QAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;;+GA/DnD,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAHxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,gBAAgB;AAC7B,iBAAA;wDAMU,YAAY,EAAA,CAAA;sBADlB;;;AC9BL;;AAEG;;;;"}
+{"version":3,"file":"taiga-ui-addon-mobile-directives-touchable.mjs","sources":["../../../projects/addon-mobile/directives/touchable/touchable.directive.ts","../../../projects/addon-mobile/directives/touchable/taiga-ui-addon-mobile-directives-touchable.ts"],"sourcesContent":["import {DOCUMENT} from '@angular/common';\nimport {computed, Directive, inject, input} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {tuiTypedFromEvent} from '@taiga-ui/cdk/observables';\nimport {TUI_IS_IOS} from '@taiga-ui/cdk/tokens';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {filter, map, race, switchMap, take, tap} from 'rxjs';\n\nconst STYLE = {\n    transform: 'scale(0.95)',\n    opacity: '0.6',\n    background: 'rgba(146, 153, 162, 0.12)',\n} as const;\n\nfunction findIndex(touches: TouchList, id = 0): number {\n    for (let i = 0; i < touches.length; i++) {\n        if (touches[i]?.identifier === id) {\n            return i;\n        }\n    }\n\n    return -1;\n}\n\n@Directive({\n    selector: '[tuiTouchable]',\n})\nexport class TuiTouchable {\n    private readonly isIOS = inject(TUI_IS_IOS);\n    private readonly el = tuiInjectElement();\n    private readonly doc = inject(DOCUMENT);\n\n    protected readonly style = computed<'background' | 'opacity' | 'transform'>(\n        () => this.tuiTouchable() || 'transform',\n    );\n\n    public readonly tuiTouchable = input<'' | 'background' | 'opacity' | 'transform'>('');\n\n    constructor() {\n        if (!this.isIOS) {\n            return;\n        }\n\n        tuiTypedFromEvent(this.el, 'touchstart', {passive: true})\n            .pipe(\n                tap(() => this.onTouchStart()),\n                map(({touches}) => touches[touches.length - 1]?.identifier),\n                switchMap((id) =>\n                    race(\n                        tuiTypedFromEvent(this.el, 'touchend'),\n                        tuiTypedFromEvent(this.el, 'touchmove', {passive: true}).pipe(\n                            filter(({touches}) => this.hasTouches(this.el, touches, id)),\n                        ),\n                    ).pipe(take(1)),\n                ),\n                takeUntilDestroyed(),\n            )\n            .subscribe(() => {\n                this.el.style.removeProperty('transform');\n                this.el.style.removeProperty('opacity');\n                this.el.style.removeProperty('background');\n            });\n    }\n\n    private hasTouches(el: HTMLElement, touches: TouchList, id?: number): boolean {\n        const index = findIndex(touches, id);\n        const {clientX = 0, clientY = 0} = touches[index] ?? {};\n\n        return index === -1 || !el.contains(this.doc.elementFromPoint(clientX, clientY));\n    }\n\n    private onTouchStart(): void {\n        if (this.style() !== 'transform') {\n            this.el.style.removeProperty('transition');\n        } else {\n            this.el.style.setProperty('transition', 'transform 0.2s');\n        }\n\n        this.el.style.setProperty(this.style(), STYLE[this.style()]);\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/taiga-ui-addon-mobile-services.mjs

@@ -1,8 +1,9 @@
 import { DOCUMENT } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, Injectable } from '@angular/core';
+import { inject, Injectable, InjectionToken } from '@angular/core';
 import { tuiGetFocused } from '@taiga-ui/cdk/utils/focus';
 import { merge, fromEvent, filter } from 'rxjs';
+import { Meta } from '@angular/platform-browser';
 
 class TuiKeyboardService {
     constructor() {
@@ -41,19 +42,47 @@ class TuiKeyboardService {
         this.element.inputMode = this.inputMode;
         this.element = undefined;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiKeyboardService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiKeyboardService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiKeyboardService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiKeyboardService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiKeyboardService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiKeyboardService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
         }] });
 
+const TUI_THEME_COLOR = new InjectionToken(ngDevMode ? 'TUI_THEME_COLOR' : '', {
+    factory: () => inject(Meta).getTag('name="theme-color"')?.content ?? '',
+});
+class TuiThemeColorService {
+    constructor() {
+        this.current = inject(TUI_THEME_COLOR);
+        this.doc = inject(DOCUMENT);
+        this.meta = inject(Meta);
+        this.color = this.current;
+    }
+    get color() {
+        return this.current;
+    }
+    set color(content) {
+        this.current = content;
+        this.meta.updateTag({ name: 'theme-color', content });
+        this.doc.documentElement.style.setProperty('--tui-theme-color', content);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiThemeColorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiThemeColorService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiThemeColorService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { TuiKeyboardService };
+export { TUI_THEME_COLOR, TuiKeyboardService, TuiThemeColorService };
 //# sourceMappingURL=taiga-ui-addon-mobile-services.mjs.map

package/fesm2022/taiga-ui-addon-mobile-services.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-addon-mobile-services.mjs","sources":["../../../projects/addon-mobile/services/keyboard.service.ts","../../../projects/addon-mobile/services/taiga-ui-addon-mobile-services.ts"],"sourcesContent":["import {DOCUMENT} from '@angular/common';\nimport {inject, Injectable, type OnDestroy} from '@angular/core';\nimport {tuiGetFocused} from '@taiga-ui/cdk/utils/focus';\nimport {filter, fromEvent, merge} from 'rxjs';\n\n@Injectable({\n    providedIn: 'root',\n})\nexport class TuiKeyboardService implements OnDestroy {\n    private readonly doc = inject(DOCUMENT);\n    private readonly sub = merge(\n        fromEvent(this.doc, 'focusout'),\n        fromEvent(this.doc, 'mousedown').pipe(\n            filter((e) => Object.is(e.target, this.element)),\n        ),\n    ).subscribe(() => {\n        this.show();\n    });\n\n    private element?: ElementContentEditable;\n    private inputMode = '';\n\n    public ngOnDestroy(): void {\n        this.sub.unsubscribe();\n        this.show();\n    }\n\n    public toggle(): void {\n        if (this.element) {\n            this.show();\n        } else {\n            this.hide();\n        }\n    }\n\n    public hide(): void {\n        const focused = tuiGetFocused(this.doc) as HTMLInputElement;\n\n        if (focused?.inputMode === undefined || this.element) {\n            return;\n        }\n\n        this.element = focused;\n        this.inputMode = focused.inputMode;\n        focused.inputMode = 'none';\n    }\n\n    public show(): void {\n        if (!this.element) {\n            return;\n        }\n\n        this.element.inputMode = 'none';\n        this.element.inputMode = this.inputMode;\n        this.element = undefined;\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MAQa,kBAAkB,CAAA;AAH/B,IAAA,WAAA,GAAA;AAIqB,QAAA,IAAA,CAAA,GAAG,GAAG,MAAM,CAAC,QAAQ,CAAC;QACtB,IAAG,CAAA,GAAA,GAAG,KAAK,CACxB,SAAS,CAAC,IAAI,CAAC,GAAG,EAAE,UAAU,CAAC,EAC/B,SAAS,CAAC,IAAI,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC,IAAI,CACjC,MAAM,CAAC,CAAC,CAAC,KAAK,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CACnD,CACJ,CAAC,SAAS,CAAC,MAAK;YACb,IAAI,CAAC,IAAI,EAAE;AACf,SAAC,CAAC;QAGM,IAAS,CAAA,SAAA,GAAG,EAAE;AAoCzB;IAlCU,WAAW,GAAA;AACd,QAAA,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE;QACtB,IAAI,CAAC,IAAI,EAAE;;IAGR,MAAM,GAAA;AACT,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;YACd,IAAI,CAAC,IAAI,EAAE;;aACR;YACH,IAAI,CAAC,IAAI,EAAE;;;IAIZ,IAAI,GAAA;QACP,MAAM,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,GAAG,CAAqB;QAE3D,IAAI,OAAO,EAAE,SAAS,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,EAAE;YAClD;;AAGJ,QAAA,IAAI,CAAC,OAAO,GAAG,OAAO;AACtB,QAAA,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS;AAClC,QAAA,OAAO,CAAC,SAAS,GAAG,MAAM;;IAGvB,IAAI,GAAA;AACP,QAAA,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YACf;;AAGJ,QAAA,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,MAAM;QAC/B,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS;AACvC,QAAA,IAAI,CAAC,OAAO,GAAG,SAAS;;+GA9CnB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,cAFf,MAAM,EAAA,CAAA,CAAA;;4FAET,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAH9B,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,UAAU,EAAE,MAAM;AACrB,iBAAA;;;ACPD;;AAEG;;;;"}
+{"version":3,"file":"taiga-ui-addon-mobile-services.mjs","sources":["../../../projects/addon-mobile/services/keyboard.service.ts","../../../projects/addon-mobile/services/theme-color.service.ts","../../../projects/addon-mobile/services/taiga-ui-addon-mobile-services.ts"],"sourcesContent":["import {DOCUMENT} from '@angular/common';\nimport {inject, Injectable, type OnDestroy} from '@angular/core';\nimport {tuiGetFocused} from '@taiga-ui/cdk/utils/focus';\nimport {filter, fromEvent, merge} from 'rxjs';\n\n@Injectable({\n    providedIn: 'root',\n})\nexport class TuiKeyboardService implements OnDestroy {\n    private readonly doc = inject(DOCUMENT);\n    private readonly sub = merge(\n        fromEvent(this.doc, 'focusout'),\n        fromEvent(this.doc, 'mousedown').pipe(\n            filter((e) => Object.is(e.target, this.element)),\n        ),\n    ).subscribe(() => {\n        this.show();\n    });\n\n    private element?: ElementContentEditable;\n    private inputMode = '';\n\n    public ngOnDestroy(): void {\n        this.sub.unsubscribe();\n        this.show();\n    }\n\n    public toggle(): void {\n        if (this.element) {\n            this.show();\n        } else {\n            this.hide();\n        }\n    }\n\n    public hide(): void {\n        const focused = tuiGetFocused(this.doc) as HTMLInputElement;\n\n        if (focused?.inputMode === undefined || this.element) {\n            return;\n        }\n\n        this.element = focused;\n        this.inputMode = focused.inputMode;\n        focused.inputMode = 'none';\n    }\n\n    public show(): void {\n        if (!this.element) {\n            return;\n        }\n\n        this.element.inputMode = 'none';\n        this.element.inputMode = this.inputMode;\n        this.element = undefined;\n    }\n}\n","import {DOCUMENT} from '@angular/common';\nimport {inject, Injectable, InjectionToken} from '@angular/core';\nimport {Meta} from '@angular/platform-browser';\n\nexport const TUI_THEME_COLOR = new InjectionToken<string>(\n    ngDevMode ? 'TUI_THEME_COLOR' : '',\n    {\n        factory: () => inject(Meta).getTag('name=\"theme-color\"')?.content ?? '',\n    },\n);\n\ninterface TuiThemeColor {\n    get color(): string;\n    set color(value: string);\n}\n\n@Injectable({\n    providedIn: 'root',\n})\nexport class TuiThemeColorService implements TuiThemeColor {\n    private current = inject(TUI_THEME_COLOR);\n    private readonly doc = inject(DOCUMENT);\n    private readonly meta = inject(Meta);\n\n    constructor() {\n        this.color = this.current;\n    }\n\n    public get color(): string {\n        return this.current;\n    }\n\n    public set color(content: string) {\n        this.current = content;\n        this.meta.updateTag({name: 'theme-color', content});\n        this.doc.documentElement.style.setProperty('--tui-theme-color', content);\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@taiga-ui/addon-mobile",
-  "version": "4.52.0-canary.c107f6a",
+  "version": "4.52.0-canary.c8448e0",
   "description": "Extension package for Taiga UI that adds support for mobile specific behaviors such as custom data pickers, dropdowns, etc.",
   "keywords": [
     "angular",
@@ -50,10 +50,6 @@
       "types": "./components/mobile-calendar-sheet/index.d.ts",
       "default": "./fesm2022/taiga-ui-addon-mobile-components-mobile-calendar-sheet.mjs"
     },
-    "./components/mobile-dialog": {
-      "types": "./components/mobile-dialog/index.d.ts",
-      "default": "./fesm2022/taiga-ui-addon-mobile-components-mobile-dialog.mjs"
-    },
     "./components/pull-to-refresh": {
       "types": "./components/pull-to-refresh/index.d.ts",
       "default": "./fesm2022/taiga-ui-addon-mobile-components-pull-to-refresh.mjs"

package/services/index.d.ts

@@ -1 +1,2 @@
 export * from './keyboard.service';
+export * from './theme-color.service';

package/services/theme-color.service.d.ts

@@ -0,0 +1,18 @@
+import { InjectionToken } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare const TUI_THEME_COLOR: InjectionToken<string>;
+interface TuiThemeColor {
+    get color(): string;
+    set color(value: string);
+}
+export declare class TuiThemeColorService implements TuiThemeColor {
+    private current;
+    private readonly doc;
+    private readonly meta;
+    constructor();
+    get color(): string;
+    set color(content: string);
+    static ɵfac: i0.ɵɵFactoryDeclaration<TuiThemeColorService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<TuiThemeColorService>;
+}
+export {};

package/styles/android/app-bar.less

@@ -1,5 +1,5 @@
 tui-app-bar {
-    font: var(--tui-font-heading-6);
+    font: var(--tui-font-heading-h6);
     block-size: 3.5rem;
 
     > .t-content {
@@ -12,6 +12,10 @@ tui-app-bar {
         > * {
             max-inline-size: calc(100% - var(--t-sides, 0px));
         }
+
+        > [tuiProgressBar] {
+            .center-left();
+        }
     }
 
     > :last-child [tuiIconButton] {

package/styles/android/switch.less

@@ -11,6 +11,7 @@ input[tuiSwitch] {
 
     &::before {
         content: '';
+        left: 0;
         display: block;
         block-size: 100%;
         inline-size: 100%;

package/styles/common/badge-notification.less

@@ -1,6 +1,6 @@
 tui-badge-notification {
     &[data-size='l'] {
-        font: var(--tui-font-text-m);
+        font: var(--tui-font-body-m);
     }
 
     &[data-size='m'] {

package/styles/common/badge.less

@@ -3,7 +3,7 @@ tui-badge,
     font-weight: 600;
 
     &[data-size='s'] {
-        font: var(--tui-font-text-xs);
+        font: var(--tui-font-body-xs);
         font-weight: bold;
     }
 
@@ -11,7 +11,7 @@ tui-badge,
         --t-padding: 0 0.625rem;
         --t-size: 1.75rem;
 
-        font: var(--tui-font-text-s);
+        font: var(--tui-font-body-s);
         font-weight: 600;
     }
 }

package/styles/common/block-status.less

@@ -24,7 +24,7 @@ tui-block-status {
     h4,
     h5,
     h6 {
-        font: var(--tui-font-heading-5);
+        font: var(--tui-font-heading-h5);
 
         & ~ .t-block-text:not(:empty) {
             margin-block-start: 0.5rem;

package/styles/common/button.less

@@ -24,7 +24,7 @@
     }
 
     &[data-size='l'] {
-        font: var(--tui-font-text-l);
+        font: var(--tui-font-body-l);
         font-weight: bold;
     }
 

package/styles/common/card-large.less

@@ -10,7 +10,7 @@
         --t-comp: -0.125rem;
     }
 
-    [tuiAccessories] > [tuiButtonClose] {
+    [tuiAccessories] > [tuiButtonX] {
         --t-size: 1.5rem;
     }
 }

package/styles/common/header.less

@@ -27,7 +27,7 @@
     &[data-size='body-m'] {
         [tuiTitle],
         [tuiAccessories] {
-            font: var(--tui-font-heading-6);
+            font: var(--tui-font-heading-h6);
         }
     }
 }

package/styles/common/message.less

@@ -1,4 +1,4 @@
 [tuiMessage] {
-    font: var(--tui-font-text-l);
+    font: var(--tui-font-body-l);
     border-radius: 0.875rem;
 }

package/styles/common/segmented.less

@@ -4,7 +4,7 @@ tui-segmented[data-size] {
     --t-margin: -0.25rem;
     --t-height: var(--tui-height-s);
 
-    font: var(--tui-font-text-s);
+    font: var(--tui-font-body-s);
     border-radius: 0.625rem;
 
     tui-icon {

package/styles/common/title.less

@@ -6,7 +6,6 @@
     }
 }
 
-tui-notification [tuiTitle] [tuiSubtitle],
 [tuiNotification] [tuiTitle] [tuiSubtitle] {
     color: var(--tui-text-primary);
 }

package/styles/common/toast.less

@@ -1,7 +1,7 @@
 [tuiToast] {
     min-block-size: 3rem;
     border-radius: 1.5rem;
-    font: var(--tui-font-text-m);
+    font: var(--tui-font-body-m);
 
     [tuiButton]:last-child {
         margin: -0.1875rem -0.4375rem -0.1875rem 0;

package/styles/ios/switch.less

@@ -1,6 +1,55 @@
 @import '@taiga-ui/core/styles/taiga-ui-local.less';
 
-input[tuiSwitch] {
+input[tuiSwitch]._native {
+    block-size: 1.9375rem;
+    inline-size: 3.1875rem;
+    appearance: auto;
+    accent-color: var(--tui-background-accent-2);
+
+    &:invalid {
+        accent-color: var(--tui-status-negative);
+    }
+
+    &::before,
+    &::after {
+        display: none;
+    }
+
+    @supports (anchor-name: --ios26) {
+        inline-size: 4rem;
+        block-size: 1.75rem;
+
+        &::before {
+            .transition(background);
+
+            position: absolute;
+            display: block;
+            inset: 0;
+            border-radius: 10rem;
+            inline-size: 100%;
+            background-color: transparent;
+            mix-blend-mode: color;
+            transform: none;
+        }
+
+        &:invalid:not(:checked)::before {
+            background-color: var(--tui-status-negative);
+        }
+
+        [data-theme='dark'] & {
+            &:invalid:not(:checked)::before {
+                background-color: var(--tui-status-negative-pale);
+            }
+
+            &:disabled:not(:checked)::before {
+                background-color: rgba(255, 255, 255, 0.2);
+                mix-blend-mode: lighten;
+            }
+        }
+    }
+}
+
+input[tuiSwitch]:not(._native) {
     block-size: 1.9375rem;
     inline-size: 3.1875rem;
     border-radius: 2rem;

package/styles/taiga-ui-mobile.less

@@ -46,4 +46,10 @@
     @import 'common/message.less';
     @import 'common/notification-middle.less';
     @import 'common/toast.less';
+
+    tui-app-bar {
+        [tuiButton][data-size='l'] {
+            font-weight: normal;
+        }
+    }
 }

package/components/mobile-dialog/index.d.ts

@@ -1,3 +0,0 @@
-export * from './mobile-dialog.component';
-export * from './mobile-dialog.options';
-export * from './mobile-dialog.service';

package/components/mobile-dialog/mobile-dialog.component.d.ts

@@ -1,10 +0,0 @@
-import { type TuiPopover } from '@taiga-ui/cdk/services';
-import { type TuiMobileDialogOptions } from './mobile-dialog.options';
-import * as i0 from "@angular/core";
-export declare class TuiMobileDialog<I> {
-    protected readonly isIOS: boolean;
-    protected readonly context: TuiPopover<TuiMobileDialogOptions<I>, number>;
-    protected onAction(index: number): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TuiMobileDialog<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TuiMobileDialog<any>, "tui-mobile-dialog", never, {}, {}, never, never, true, never>;
-}

package/components/mobile-dialog/mobile-dialog.options.d.ts

@@ -1,12 +0,0 @@
-import { InjectionToken, type Provider } from '@angular/core';
-export interface TuiMobileDialogOptions<I = undefined> {
-    readonly actions: readonly string[];
-    readonly data: I;
-    readonly label: string;
-}
-export declare const TUI_MOBILE_DIALOG_DEFAULT_OPTIONS: TuiMobileDialogOptions;
-/**
- * Default parameters for mobile dialog component
- */
-export declare const TUI_MOBILE_DIALOG_OPTIONS: InjectionToken<TuiMobileDialogOptions<undefined>>;
-export declare function tuiMobileDialogOptionsProvider(options: Partial<TuiMobileDialogOptions<unknown>>): Provider;

package/components/mobile-dialog/mobile-dialog.service.d.ts

@@ -1,10 +0,0 @@
-import { type TuiPopoverContext, TuiPopoverService } from '@taiga-ui/cdk/services';
-import { type PolymorpheusContent } from '@taiga-ui/polymorpheus';
-import { type Observable } from 'rxjs';
-import { type TuiMobileDialogOptions } from './mobile-dialog.options';
-import * as i0 from "@angular/core";
-export declare class TuiMobileDialogService extends TuiPopoverService<TuiMobileDialogOptions<any>, number> {
-    open(content: PolymorpheusContent<TuiMobileDialogOptions<any> & TuiPopoverContext<number>>, options?: Partial<TuiMobileDialogOptions<any>>): Observable<number>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TuiMobileDialogService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<TuiMobileDialogService>;
-}

package/fesm2022/taiga-ui-addon-mobile-components-mobile-dialog.mjs

@@ -1,64 +0,0 @@
-import * as i0 from '@angular/core';
-import { inject, ChangeDetectionStrategy, Component, InjectionToken, Injectable } from '@angular/core';
-import { TuiRipple } from '@taiga-ui/addon-mobile/directives';
-import { TUI_IS_IOS } from '@taiga-ui/cdk/tokens';
-import { TuiButton } from '@taiga-ui/core/components/button';
-import { injectContext, PolymorpheusOutlet } from '@taiga-ui/polymorpheus';
-import { tuiProvideOptions } from '@taiga-ui/cdk/utils/miscellaneous';
-import { TuiPopoverService } from '@taiga-ui/cdk/services';
-import { TUI_DIALOGS } from '@taiga-ui/core/components/dialog';
-
-class TuiMobileDialog {
-    constructor() {
-        this.isIOS = inject(TUI_IS_IOS);
-        this.context = injectContext();
-    }
-    onAction(index) {
-        this.context.completeWith(index);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiMobileDialog, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TuiMobileDialog, isStandalone: true, selector: "tui-mobile-dialog", host: { properties: { "class._ios": "isIOS" } }, ngImport: i0, template: "@if (!!context.label) {\n    <h2\n        automation-id=\"tui-mobile-dialog__label\"\n        class=\"t-heading\"\n        [id]=\"context.id\"\n    >\n        {{ context.label }}\n    </h2>\n}\n<div class=\"t-content\">\n    <ng-container *polymorpheusOutlet=\"context.content as text; context: context\">\n        {{ text }}\n    </ng-container>\n</div>\n@for (action of context.actions; track action) {\n    <button\n        appearance=\"flat\"\n        size=\"s\"\n        tuiButton\n        tuiRipple\n        type=\"button\"\n        class=\"t-button\"\n        [class.t-button_column]=\"$count > 2\"\n        (click)=\"onAction($index)\"\n    >\n        {{ action }}\n    </button>\n}\n", styles: [":host{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:block;background:var(--tui-background-base);word-break:break-word;overflow:hidden;padding:1.25rem .75rem 0 1.5rem}:host:not(._ios){max-inline-size:17.5rem;border-radius:.125rem;text-align:start;box-shadow:0 1.5rem 1.5rem #00000052}:host._ios{max-inline-size:16.875rem;padding:1.5rem 0 0;border-radius:.75rem;text-align:center}.t-heading{font-size:1rem}:host._ios .t-heading{font-weight:700;font-size:1.125rem}.t-content{margin-block-start:.75rem;font-size:.875rem;line-height:1.25rem;padding-inline-end:.75rem}:host._ios .t-content{margin-block-start:.25rem;padding-inline-start:1.5rem;padding-inline-end:1.5rem}.t-button{border-radius:0}:host._ios .t-button{border-block-start:#b8b8b8 1px solid;block-size:2.625rem;inline-size:100%}:host._ios .t-button:first-of-type{margin-block-start:1.125rem}:host:not(._ios) .t-button{margin:.5rem 0 .5rem .5rem;float:inline-end}:host:not(._ios) .t-button_column{display:block;float:none;margin-inline-start:auto}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: TuiRipple, selector: "[tuiRipple]", inputs: ["tuiRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiMobileDialog, decorators: [{
-            type: Component,
-            args: [{ selector: 'tui-mobile-dialog', imports: [PolymorpheusOutlet, TuiButton, TuiRipple], changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        '[class._ios]': 'isIOS',
-                    }, template: "@if (!!context.label) {\n    <h2\n        automation-id=\"tui-mobile-dialog__label\"\n        class=\"t-heading\"\n        [id]=\"context.id\"\n    >\n        {{ context.label }}\n    </h2>\n}\n<div class=\"t-content\">\n    <ng-container *polymorpheusOutlet=\"context.content as text; context: context\">\n        {{ text }}\n    </ng-container>\n</div>\n@for (action of context.actions; track action) {\n    <button\n        appearance=\"flat\"\n        size=\"s\"\n        tuiButton\n        tuiRipple\n        type=\"button\"\n        class=\"t-button\"\n        [class.t-button_column]=\"$count > 2\"\n        (click)=\"onAction($index)\"\n    >\n        {{ action }}\n    </button>\n}\n", styles: [":host{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:block;background:var(--tui-background-base);word-break:break-word;overflow:hidden;padding:1.25rem .75rem 0 1.5rem}:host:not(._ios){max-inline-size:17.5rem;border-radius:.125rem;text-align:start;box-shadow:0 1.5rem 1.5rem #00000052}:host._ios{max-inline-size:16.875rem;padding:1.5rem 0 0;border-radius:.75rem;text-align:center}.t-heading{font-size:1rem}:host._ios .t-heading{font-weight:700;font-size:1.125rem}.t-content{margin-block-start:.75rem;font-size:.875rem;line-height:1.25rem;padding-inline-end:.75rem}:host._ios .t-content{margin-block-start:.25rem;padding-inline-start:1.5rem;padding-inline-end:1.5rem}.t-button{border-radius:0}:host._ios .t-button{border-block-start:#b8b8b8 1px solid;block-size:2.625rem;inline-size:100%}:host._ios .t-button:first-of-type{margin-block-start:1.125rem}:host:not(._ios) .t-button{margin:.5rem 0 .5rem .5rem;float:inline-end}:host:not(._ios) .t-button_column{display:block;float:none;margin-inline-start:auto}\n"] }]
-        }] });
-
-const TUI_MOBILE_DIALOG_DEFAULT_OPTIONS = {
-    label: '',
-    actions: ['OK'],
-    data: undefined,
-};
-/**
- * Default parameters for mobile dialog component
- */
-const TUI_MOBILE_DIALOG_OPTIONS = new InjectionToken(ngDevMode ? 'TUI_MOBILE_DIALOG_OPTIONS' : '', {
-    factory: () => TUI_MOBILE_DIALOG_DEFAULT_OPTIONS,
-});
-function tuiMobileDialogOptionsProvider(options) {
-    return tuiProvideOptions(TUI_MOBILE_DIALOG_OPTIONS, options, TUI_MOBILE_DIALOG_DEFAULT_OPTIONS);
-}
-
-class TuiMobileDialogService extends TuiPopoverService {
-    open(content, options = {}) {
-        return super.open(content, options);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiMobileDialogService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiMobileDialogService, providedIn: 'root', useFactory: () => new TuiMobileDialogService(TUI_DIALOGS, TuiMobileDialog, inject(TUI_MOBILE_DIALOG_OPTIONS)) }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiMobileDialogService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                    useFactory: () => new TuiMobileDialogService(TUI_DIALOGS, TuiMobileDialog, inject(TUI_MOBILE_DIALOG_OPTIONS)),
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { TUI_MOBILE_DIALOG_DEFAULT_OPTIONS, TUI_MOBILE_DIALOG_OPTIONS, TuiMobileDialog, TuiMobileDialogService, tuiMobileDialogOptionsProvider };
-//# sourceMappingURL=taiga-ui-addon-mobile-components-mobile-dialog.mjs.map

package/fesm2022/taiga-ui-addon-mobile-components-mobile-dialog.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"taiga-ui-addon-mobile-components-mobile-dialog.mjs","sources":["../../../projects/addon-mobile/components/mobile-dialog/mobile-dialog.component.ts","../../../projects/addon-mobile/components/mobile-dialog/mobile-dialog.template.html","../../../projects/addon-mobile/components/mobile-dialog/mobile-dialog.options.ts","../../../projects/addon-mobile/components/mobile-dialog/mobile-dialog.service.ts","../../../projects/addon-mobile/components/mobile-dialog/taiga-ui-addon-mobile-components-mobile-dialog.ts"],"sourcesContent":["import {ChangeDetectionStrategy, Component, inject} from '@angular/core';\nimport {TuiRipple} from '@taiga-ui/addon-mobile/directives';\nimport {type TuiPopover} from '@taiga-ui/cdk/services';\nimport {TUI_IS_IOS} from '@taiga-ui/cdk/tokens';\nimport {TuiButton} from '@taiga-ui/core/components/button';\nimport {injectContext, PolymorpheusOutlet} from '@taiga-ui/polymorpheus';\n\nimport {type TuiMobileDialogOptions} from './mobile-dialog.options';\n\n@Component({\n    selector: 'tui-mobile-dialog',\n    imports: [PolymorpheusOutlet, TuiButton, TuiRipple],\n    templateUrl: './mobile-dialog.template.html',\n    styleUrl: './mobile-dialog.style.less',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[class._ios]': 'isIOS',\n    },\n})\nexport class TuiMobileDialog<I> {\n    protected readonly isIOS = inject(TUI_IS_IOS);\n    protected readonly context =\n        injectContext<TuiPopover<TuiMobileDialogOptions<I>, number>>();\n\n    protected onAction(index: number): void {\n        this.context.completeWith(index);\n    }\n}\n","@if (!!context.label) {\n    <h2\n        automation-id=\"tui-mobile-dialog__label\"\n        class=\"t-heading\"\n        [id]=\"context.id\"\n    >\n        {{ context.label }}\n    </h2>\n}\n<div class=\"t-content\">\n    <ng-container *polymorpheusOutlet=\"context.content as text; context: context\">\n        {{ text }}\n    </ng-container>\n</div>\n@for (action of context.actions; track action) {\n    <button\n        appearance=\"flat\"\n        size=\"s\"\n        tuiButton\n        tuiRipple\n        type=\"button\"\n        class=\"t-button\"\n        [class.t-button_column]=\"$count > 2\"\n        (click)=\"onAction($index)\"\n    >\n        {{ action }}\n    </button>\n}\n","import {InjectionToken, type Provider} from '@angular/core';\nimport {tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\n\nexport interface TuiMobileDialogOptions<I = undefined> {\n    readonly actions: readonly string[];\n    readonly data: I;\n    readonly label: string;\n}\n\nexport const TUI_MOBILE_DIALOG_DEFAULT_OPTIONS: TuiMobileDialogOptions = {\n    label: '',\n    actions: ['OK'],\n    data: undefined,\n};\n\n/**\n * Default parameters for mobile dialog component\n */\nexport const TUI_MOBILE_DIALOG_OPTIONS = new InjectionToken(\n    ngDevMode ? 'TUI_MOBILE_DIALOG_OPTIONS' : '',\n    {\n        factory: () => TUI_MOBILE_DIALOG_DEFAULT_OPTIONS,\n    },\n);\n\nexport function tuiMobileDialogOptionsProvider(\n    options: Partial<TuiMobileDialogOptions<unknown>>,\n): Provider {\n    return tuiProvideOptions(\n        TUI_MOBILE_DIALOG_OPTIONS,\n        options,\n        TUI_MOBILE_DIALOG_DEFAULT_OPTIONS,\n    );\n}\n","import {inject, Injectable} from '@angular/core';\nimport {type TuiPopoverContext, TuiPopoverService} from '@taiga-ui/cdk/services';\nimport {TUI_DIALOGS} from '@taiga-ui/core/components/dialog';\nimport {type PolymorpheusContent} from '@taiga-ui/polymorpheus';\nimport {type Observable} from 'rxjs';\n\nimport {TuiMobileDialog} from './mobile-dialog.component';\nimport {\n    TUI_MOBILE_DIALOG_OPTIONS,\n    type TuiMobileDialogOptions,\n} from './mobile-dialog.options';\n\n@Injectable({\n    providedIn: 'root',\n    useFactory: () =>\n        new TuiMobileDialogService(\n            TUI_DIALOGS,\n            TuiMobileDialog,\n            inject(TUI_MOBILE_DIALOG_OPTIONS),\n        ),\n})\nexport class TuiMobileDialogService extends TuiPopoverService<\n    TuiMobileDialogOptions<any>,\n    number\n> {\n    public override open(\n        content: PolymorpheusContent<\n            TuiMobileDialogOptions<any> & TuiPopoverContext<number>\n        >,\n        options: Partial<TuiMobileDialogOptions<any>> = {},\n    ): Observable<number> {\n        return super.open(content, options);\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}