@taiga-ui/core 4.94.0 → 4.95.0

package/fesm2022/taiga-ui-core-directives-appearance.mjs

@@ -18,11 +18,11 @@ function tuiAppearanceOptionsProvider(token) {
 
 class TuiAppearanceStyles {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiAppearanceStyles, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiAppearanceStyles, isStandalone: true, selector: "ng-component", exportAs: ["tui-appearance-4.94.0"], ngImport: i0, template: '', isInline: true, styles: ["[tuiAppearanceV=\"4.94.0\"]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;-webkit-appearance:none;appearance:none;outline:.125rem solid transparent;outline-offset:-.125rem;transition-property:color,background-color,opacity,box-shadow,border-color,border-radius,filter}[tuiAppearanceV=\"4.94.0\"]:before,[tuiAppearanceV=\"4.94.0\"]:after{transition-duration:inherit;transition-timing-function:ease-in-out}[tuiAppearanceV=\"4.94.0\"]:focus-visible:not([data-focus=false]){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"][data-focus=true]{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"][tuiWrapper]:not(._focused):has(:focus-visible){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"][tuiWrapper]._focused._focused{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"]:disabled:not([data-state]),[tuiAppearanceV=\"4.94.0\"][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}[tuiAppearanceV=\"4.94.0\"][tuiWrapper]:disabled:not([data-state]),[tuiAppearanceV=\"4.94.0\"][tuiWrapper][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiAppearanceStyles, isStandalone: true, selector: "ng-component", exportAs: ["tui-appearance-4.95.0"], ngImport: i0, template: '', isInline: true, styles: ["[tuiAppearanceV=\"4.95.0\"]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;-webkit-appearance:none;appearance:none;outline:.125rem solid transparent;outline-offset:-.125rem;transition-property:color,background-color,opacity,box-shadow,border-color,border-radius,filter}[tuiAppearanceV=\"4.95.0\"]:before,[tuiAppearanceV=\"4.95.0\"]:after{transition-duration:inherit;transition-timing-function:ease-in-out}[tuiAppearanceV=\"4.95.0\"]:focus-visible:not([data-focus=false]){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"][data-focus=true]{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"][tuiWrapper]:not(._focused):has(:focus-visible){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"][tuiWrapper]._focused._focused{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"]:disabled:not([data-state]),[tuiAppearanceV=\"4.95.0\"][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}[tuiAppearanceV=\"4.95.0\"][tuiWrapper]:disabled:not([data-state]),[tuiAppearanceV=\"4.95.0\"][tuiWrapper][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiAppearanceStyles, decorators: [{
             type: Component,
-            args: [{ standalone: true, template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: `tui-appearance-${TUI_VERSION}`, styles: ["[tuiAppearanceV=\"4.94.0\"]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;-webkit-appearance:none;appearance:none;outline:.125rem solid transparent;outline-offset:-.125rem;transition-property:color,background-color,opacity,box-shadow,border-color,border-radius,filter}[tuiAppearanceV=\"4.94.0\"]:before,[tuiAppearanceV=\"4.94.0\"]:after{transition-duration:inherit;transition-timing-function:ease-in-out}[tuiAppearanceV=\"4.94.0\"]:focus-visible:not([data-focus=false]){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"][data-focus=true]{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"][tuiWrapper]:not(._focused):has(:focus-visible){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"][tuiWrapper]._focused._focused{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.94.0\"]:disabled:not([data-state]),[tuiAppearanceV=\"4.94.0\"][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}[tuiAppearanceV=\"4.94.0\"][tuiWrapper]:disabled:not([data-state]),[tuiAppearanceV=\"4.94.0\"][tuiWrapper][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}\n"] }]
+            args: [{ standalone: true, template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: `tui-appearance-${TUI_VERSION}`, styles: ["[tuiAppearanceV=\"4.95.0\"]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;-webkit-appearance:none;appearance:none;outline:.125rem solid transparent;outline-offset:-.125rem;transition-property:color,background-color,opacity,box-shadow,border-color,border-radius,filter}[tuiAppearanceV=\"4.95.0\"]:before,[tuiAppearanceV=\"4.95.0\"]:after{transition-duration:inherit;transition-timing-function:ease-in-out}[tuiAppearanceV=\"4.95.0\"]:focus-visible:not([data-focus=false]){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"][data-focus=true]{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"][tuiWrapper]:not(._focused):has(:focus-visible){outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"][tuiWrapper]._focused._focused{outline-color:var(--tui-border-focus)}[tuiAppearanceV=\"4.95.0\"]:disabled:not([data-state]),[tuiAppearanceV=\"4.95.0\"][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}[tuiAppearanceV=\"4.95.0\"][tuiWrapper]:disabled:not([data-state]),[tuiAppearanceV=\"4.95.0\"][tuiWrapper][data-state=disabled]{cursor:initial;opacity:var(--tui-disabled-opacity)}\n"] }]
         }] });
 class TuiAppearance {
     constructor() {
@@ -58,7 +58,7 @@ class TuiAppearance {
         this.mode.set(mode);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiAppearance, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiAppearance, isStandalone: true, selector: "[tuiAppearance]", inputs: { tuiAppearance: "tuiAppearance", tuiAppearanceState: "tuiAppearanceState", tuiAppearanceFocus: "tuiAppearanceFocus", tuiAppearanceMode: "tuiAppearanceMode" }, host: { attributes: { "tuiAppearance": "", "tuiAppearanceV": "4.94.0" }, properties: { "attr.data-appearance": "appearance()", "attr.data-state": "state()", "attr.data-focus": "focus()", "attr.data-mode": "modes()" } }, hostDirectives: [{ directive: i1.TuiTransitioned }], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiAppearance, isStandalone: true, selector: "[tuiAppearance]", inputs: { tuiAppearance: "tuiAppearance", tuiAppearanceState: "tuiAppearanceState", tuiAppearanceFocus: "tuiAppearanceFocus", tuiAppearanceMode: "tuiAppearanceMode" }, host: { attributes: { "tuiAppearance": "", "tuiAppearanceV": "4.95.0" }, properties: { "attr.data-appearance": "appearance()", "attr.data-state": "state()", "attr.data-focus": "focus()", "attr.data-mode": "modes()" } }, hostDirectives: [{ directive: i1.TuiTransitioned }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiAppearance, decorators: [{
             type: Directive,

package/fesm2022/taiga-ui-core-directives-dropdown.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, Directive, InjectionToken, Optional, Self, SkipSelf, inject, Input, EventEmitter, Output, effect, signal, ChangeDetectorRef, INJECTOR, TemplateRef, ElementRef, computed, Component, ChangeDetectionStrategy, NgZone, ContentChild, ViewContainerRef } from '@angular/core';
+import { Injectable, Directive, InjectionToken, Optional, Self, SkipSelf, inject, Input, EventEmitter, Output, effect, signal, ChangeDetectorRef, INJECTOR, TemplateRef, ElementRef, computed, Component, ChangeDetectionStrategy, NgZone, ContentChild, PLATFORM_ID, ViewContainerRef } from '@angular/core';
 import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
 import { EMPTY_CLIENT_RECT, TUI_TRUE_HANDLER, CHAR_ZERO_WIDTH_SPACE, CHAR_NO_BREAK_SPACE } from '@taiga-ui/cdk/constants';
 import * as i1 from '@taiga-ui/cdk/directives/active-zone';
@@ -14,14 +14,14 @@ import { TuiScrollbar } from '@taiga-ui/core/components/scrollbar';
 import { TuiVisualViewportService, TuiPositionService } from '@taiga-ui/core/services';
 import { TUI_VIEWPORT, TUI_DARK_MODE, TUI_SELECTION_STREAM } from '@taiga-ui/core/tokens';
 import { PolymorpheusComponent, PolymorpheusTemplate, PolymorpheusOutlet } from '@taiga-ui/polymorpheus';
-import { BehaviorSubject, Subject, throttleTime, takeWhile, map, merge, filter, fromEvent, switchMap, delay, startWith, takeUntil, distinctUntilChanged, of, EMPTY, tap, share, combineLatest } from 'rxjs';
+import { BehaviorSubject, Subject, throttleTime, takeWhile, map, merge, filter, fromEvent, NEVER, switchMap, delay, startWith, takeUntil, distinctUntilChanged, of, EMPTY, tap, share, combineLatest } from 'rxjs';
 import { coerceArray } from '@angular/cdk/coercion';
-import { tuiZonefreeScheduler, tuiTypedFromEvent, tuiZonefree, tuiIfMap, tuiCloseWatcher, tuiZonefull, tuiWatch, tuiZoneOptimized } from '@taiga-ui/cdk/observables';
+import { tuiZonefreeScheduler, tuiTypedFromEvent, tuiZonefree, tuiIfMap, tuiCloseWatcher, tuiZonefull, tuiWatch } from '@taiga-ui/cdk/observables';
 import { tuiOverrideOptions, tuiCheckFixedPosition, tuiGetWordRange } from '@taiga-ui/core/utils';
 import { TuiPortalService, TuiPortals, tuiAsPortal } from '@taiga-ui/cdk/classes';
 import { __decorate } from 'tslib';
 import { TuiIdService } from '@taiga-ui/cdk/services';
-import { DOCUMENT } from '@angular/common';
+import { DOCUMENT, isPlatformBrowser } from '@angular/common';
 import { TUI_IS_TOUCH, TUI_RANGE } from '@taiga-ui/cdk/tokens';
 import * as i1$1 from '@taiga-ui/cdk/directives/obscured';
 import { TuiObscured } from '@taiga-ui/cdk/directives/obscured';
@@ -685,10 +685,9 @@ class TuiDropdownHover extends TuiDriver {
          * swipe on mobile devices removes dropdown sheet without triggering new mouseover / mouseout events.
          */
         this.dropdownExternalRemoval$ = toObservable(inject(TuiDropdownDirective).ref).pipe(filter((x) => !x && this.hovered));
-        this.stream$ = merge(this.dropdownExternalRemoval$.pipe(switchMap(() => tuiTypedFromEvent(this.doc, 'pointerdown').pipe(map(tuiGetActualTarget), delay(this.hideDelay), startWith(null), takeUntil(fromEvent(this.doc, 'mouseover'))))), tuiTypedFromEvent(this.doc, 'mouseover').pipe(map(tuiGetActualTarget)), tuiTypedFromEvent(this.doc, 'mouseout').pipe(map((e) => e.relatedTarget))).pipe(map((element) => tuiIsElement(element) && this.isHovered(element)), distinctUntilChanged(), switchMap((visible) => of(visible).pipe(delay(visible ? this.showDelay : this.hideDelay), takeUntil(this.open ? fromEvent(this.el, 'pointerdown') : EMPTY))), tuiZoneOptimized(), tap((hovered) => {
-            this.hovered = hovered;
-            this.open?.toggle(hovered);
-        }), share());
+        this.stream$ = isPlatformBrowser(inject(PLATFORM_ID))
+            ? this.createStream()
+            : NEVER;
         this.showDelay = this.options.showDelay;
         this.hideDelay = this.options.hideDelay;
         this.hovered = false;
@@ -705,6 +704,20 @@ class TuiDropdownHover extends TuiDriver {
         const child = !this.el.contains(element) && this.activeZone.contains(element);
         return hovered || child;
     }
+    createStream() {
+        const root = this.el.getRootNode();
+        const mouseover$ = tuiTypedFromEvent(root, 'mouseover');
+        const mouseout$ = tuiTypedFromEvent(root, 'mouseout');
+        return merge(
+        /**
+         * Dropdown can be removed not only via click/touch –
+         * swipe on mobile devices removes dropdown sheet without triggering new mouseover / mouseout events.
+         */
+        this.dropdownExternalRemoval$.pipe(switchMap(() => tuiTypedFromEvent(this.doc, 'pointerdown').pipe(map(tuiGetActualTarget), delay(this.hideDelay), startWith(null), takeUntil(mouseover$)))), mouseover$.pipe(map(tuiGetActualTarget)), mouseout$.pipe(map((event) => event.relatedTarget))).pipe(map((element) => tuiIsElement(element) && this.isHovered(element)), distinctUntilChanged(), switchMap((visible) => of(visible).pipe(delay(visible ? this.showDelay : this.hideDelay), takeUntil(this.open ? fromEvent(this.el, 'pointerdown') : EMPTY))), tap((hovered) => {
+            this.hovered = hovered;
+            this.open?.toggle(hovered);
+        }), share());
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDropdownHover, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiDropdownHover, isStandalone: true, selector: "[tuiDropdownHover]", inputs: { showDelay: ["tuiDropdownShowDelay", "showDelay"], hideDelay: ["tuiDropdownHideDelay", "hideDelay"] }, host: { listeners: { "click.capture": "onClick($event)" } }, providers: [TuiActiveZone, tuiAsDriver(TuiDropdownHover)], queries: [{ propertyName: "dropdownHost", first: true, predicate: ["tuiDropdownHost"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0 }); }
 }