igniteui-angular 20.2.0-alpha.2 → 20.2.0-alpha.3

package/fesm2022/igniteui-angular.mjs

@@ -1064,6 +1064,9 @@ class IgxSorting {
     prepareExpressions(expressions, grid) {
         const multipleSortingExpressions = [];
         for (const expr of expressions) {
+            if (expr.dir === SortingDirection.None) {
+                continue;
+            }
             if (!expr.strategy) {
                 expr.strategy = DefaultSortingStrategy.instance();
             }
@@ -10261,6 +10264,9 @@ class IgxInputDirective {
         const elTag = this.nativeElement.tagName.toLowerCase();
         if (elTag === 'textarea') {
             this.isTextArea = true;
+            if (this.nativeElement.getAttribute('rows') === null) {
+                this.renderer.setAttribute(this.nativeElement, 'rows', '3');
+            }
         }
         else {
             this.isInput = true;
@@ -21386,6 +21392,8 @@ class IgxTooltipDirective extends IgxToggleDirective {
         this._role = 'tooltip';
         this._destroy$ = new Subject();
         this._document = inject(DOCUMENT);
+        this._renderer = inject(Renderer2);
+        this._platformUtil = inject(PlatformUtil);
         this.onDocumentTouchStart = this.onDocumentTouchStart.bind(this);
         this.opening.pipe(takeUntil$1(this._destroy$)).subscribe(() => {
             this._document.addEventListener('touchstart', this.onDocumentTouchStart, { passive: true });
@@ -21393,7 +21401,12 @@ class IgxTooltipDirective extends IgxToggleDirective {
         this.closed.pipe(takeUntil$1(this._destroy$)).subscribe(() => {
             this._document.removeEventListener('touchstart', this.onDocumentTouchStart);
         });
-        this._createArrow();
+    }
+    /** @hidden */
+    ngAfterViewInit() {
+        if (this._platformUtil.isBrowser) {
+            this._createArrow();
+        }
     }
     /** @hidden */
     ngOnDestroy() {
@@ -21401,7 +21414,9 @@ class IgxTooltipDirective extends IgxToggleDirective {
         this._document.removeEventListener('touchstart', this.onDocumentTouchStart);
         this._destroy$.next(true);
         this._destroy$.complete();
-        this._removeArrow();
+        if (this.arrow) {
+            this._removeArrow();
+        }
     }
     /**
      * @hidden
@@ -21417,35 +21432,48 @@ class IgxTooltipDirective extends IgxToggleDirective {
     }
     /**
      * If there is an animation in progress, this method will reset it to its initial state.
-     * Optional `force` parameter that ends the animation.
+     * Allows hovering over the tooltip while an open/close animation is running.
+     * Stops the animation and immediately shows the tooltip.
      *
      * @hidden
-     * @param force if set to `true`, the animation will be ended.
      */
-    stopAnimations(force = false) {
+    stopAnimations() {
         const info = this.overlayService.getOverlayById(this._overlayId);
         if (!info)
             return;
         if (info.openAnimationPlayer) {
             info.openAnimationPlayer.reset();
-            if (force) {
-                info.openAnimationPlayer.finish();
-                info.openAnimationPlayer = null;
-            }
         }
         if (info.closeAnimationPlayer) {
             info.closeAnimationPlayer.reset();
-            if (force) {
-                info.closeAnimationPlayer.finish();
-                info.closeAnimationPlayer = null;
-            }
+        }
+    }
+    /**
+     * If there is a close animation in progress, this method will end it.
+     * If there is no close animation in progress, this method will close the tooltip with no animation.
+     *
+     * @param overlaySettings settings to use for closing the tooltip
+     * @hidden
+     */
+    forceClose(overlaySettings) {
+        const info = this.overlayService.getOverlayById(this._overlayId);
+        if (info && info.closeAnimationPlayer) {
+            info.closeAnimationPlayer.finish();
+            info.closeAnimationPlayer.reset();
+            info.closeAnimationPlayer = null;
+        }
+        else if (!this.collapsed) {
+            const animation = overlaySettings.positionStrategy.settings.closeAnimation;
+            overlaySettings.positionStrategy.settings.closeAnimation = null;
+            this.close();
+            overlaySettings.positionStrategy.settings.closeAnimation = animation;
         }
     }
     _createArrow() {
-        this._arrowEl = document.createElement('span');
-        this._arrowEl.style.position = 'absolute';
-        this._arrowEl.setAttribute('data-arrow', 'true');
-        this.element.appendChild(this._arrowEl);
+        this._arrowEl = this._renderer.createElement('span');
+        this._renderer.setStyle(this._arrowEl, 'position', 'absolute');
+        this._renderer.setAttribute(this._arrowEl, 'data-arrow', 'true');
+        this._renderer.appendChild(this.element, this._arrowEl);
     }
     _removeArrow() {
         this._arrowEl.remove();
@@ -21847,7 +21875,7 @@ class IgxTooltipTargetDirective extends IgxToggleActionDirective {
      * ```
      */
     set hasArrow(value) {
-        if (this.target) {
+        if (this.target && this.target.arrow) {
             this.target.arrow.style.display = value ? '' : 'none';
         }
         this._hasArrow = value;
@@ -22133,14 +22161,6 @@ class IgxTooltipTargetDirective extends IgxToggleActionDirective {
             this._hideOnInteraction();
         }
     }
-    /**
-     * @hidden
-     */
-    ngOnChanges(changes) {
-        if (changes['hasArrow']) {
-            this.target.arrow.style.display = changes['hasArrow'].currentValue ? '' : 'none';
-        }
-    }
     /**
      * @hidden
      */
@@ -22161,6 +22181,14 @@ class IgxTooltipTargetDirective extends IgxToggleActionDirective {
         });
         this.nativeElement.addEventListener('touchstart', this.onTouchStart = this.onTouchStart.bind(this), { passive: true });
     }
+    /**
+     * @hidden
+     */
+    ngAfterViewInit() {
+        if (this.target && this.target.arrow) {
+            this.target.arrow.style.display = this.hasArrow ? '' : 'none';
+        }
+    }
     /**
      * @hidden
      */
@@ -22268,8 +22296,6 @@ class IgxTooltipTargetDirective extends IgxToggleActionDirective {
     }
     /**
      * Used when a single tooltip is used for multiple targets.
-     * If the tooltip is shown for one target and the user interacts with another target,
-     * the tooltip is instantly hidden for the first target.
      */
     _checkTooltipForMultipleTargets() {
         if (!this.target.tooltipTarget) {
@@ -22281,8 +22307,10 @@ class IgxTooltipTargetDirective extends IgxToggleActionDirective {
             if (this.target.tooltipTarget.sticky) {
                 this.target.tooltipTarget._removeCloseButtonFromTooltip();
             }
+            // If the tooltip is shown for one target and the user interacts with another target,
+            // the tooltip is instantly hidden for the first target.
             clearTimeout(this.target.timeoutId);
-            this.target.stopAnimations(true);
+            this.target.forceClose(this._mergedOverlaySettings);
             this.target.tooltipTarget = this;
             this._isForceClosed = true;
         }
@@ -22348,7 +22376,7 @@ class IgxTooltipTargetDirective extends IgxToggleActionDirective {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: IgxTooltipTargetDirective, deps: [{ token: i0.ElementRef }, { token: IgxNavigationService, optional: true }, { token: i0.ViewContainerRef }, { token: i0.Renderer2 }, { token: i0.EnvironmentInjector }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.6", type: IgxTooltipTargetDirective, isStandalone: true, selector: "[igxTooltipTarget]", inputs: { showDelay: "showDelay", hideDelay: "hideDelay", hasArrow: "hasArrow", sticky: "sticky", closeTemplate: ["closeButtonTemplate", "closeTemplate"], positionSettings: "positionSettings", tooltipDisabled: ["tooltipDisabled", "tooltipDisabled", booleanAttribute], target: ["igxTooltipTarget", "target"], tooltip: "tooltip" }, outputs: { tooltipShow: "tooltipShow", tooltipHide: "tooltipHide" }, host: { listeners: { "click": "onClick()", "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, exportAs: ["tooltipTarget"], usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.6", type: IgxTooltipTargetDirective, isStandalone: true, selector: "[igxTooltipTarget]", inputs: { showDelay: "showDelay", hideDelay: "hideDelay", hasArrow: "hasArrow", sticky: "sticky", closeTemplate: ["closeButtonTemplate", "closeTemplate"], positionSettings: "positionSettings", tooltipDisabled: ["tooltipDisabled", "tooltipDisabled", booleanAttribute], target: ["igxTooltipTarget", "target"], tooltip: "tooltip" }, outputs: { tooltipShow: "tooltipShow", tooltipHide: "tooltipHide" }, host: { listeners: { "click": "onClick()", "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, exportAs: ["tooltipTarget"], usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: IgxTooltipTargetDirective, decorators: [{
             type: Directive,
@@ -94740,12 +94768,10 @@ class IgxSplitterComponent {
     onMoveEnd(delta) {
         let [paneSize, siblingSize] = this.calcNewSizes(delta);
         if (paneSize + siblingSize > this.getTotalSize() && delta < 0) {
-            paneSize = this.getTotalSize();
-            siblingSize = 0;
+            siblingSize = this.getTotalSize() - paneSize;
         }
         else if (paneSize + siblingSize > this.getTotalSize() && delta > 0) {
-            paneSize = 0;
-            siblingSize = this.getTotalSize();
+            paneSize = this.getTotalSize() - siblingSize;
         }
         if (this.pane.isPercentageSize) {
             // handle % resizes
@@ -99289,11 +99315,11 @@ class IgxChatComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: IgxChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.6", type: IgxChatComponent, isStandalone: true, selector: "igx-chat", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, draftMessage: { classPropertyName: "draftMessage", publicName: "draftMessage", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { messageCreated: "messageCreated", attachmentClick: "attachmentClick", attachmentDrag: "attachmentDrag", attachmentDrop: "attachmentDrop", typingChange: "typingChange", inputFocus: "inputFocus", inputBlur: "inputBlur", inputChange: "inputChange" }, ngImport: i0, template: "<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n></igc-chat>\n", styles: ["igc-chat{--igc-chat-height: calc(100vh - 32px) }\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.6", type: IgxChatComponent, isStandalone: true, selector: "igx-chat", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, draftMessage: { classPropertyName: "draftMessage", publicName: "draftMessage", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { messageCreated: "messageCreated", attachmentClick: "attachmentClick", attachmentDrag: "attachmentDrag", attachmentDrop: "attachmentDrop", typingChange: "typingChange", inputFocus: "inputFocus", inputBlur: "inputBlur", inputChange: "inputChange" }, ngImport: i0, template: "<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n    <ng-content></ng-content>\n</igc-chat>\n", styles: ["igc-chat{--igc-chat-height: calc(100vh - 32px) }\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: IgxChatComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igx-chat', changeDetection: ChangeDetectionStrategy.OnPush, schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n></igc-chat>\n", styles: ["igc-chat{--igc-chat-height: calc(100vh - 32px) }\n"] }]
+            args: [{ selector: 'igx-chat', changeDetection: ChangeDetectionStrategy.OnPush, schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n    <ng-content></ng-content>\n</igc-chat>\n", styles: ["igc-chat{--igc-chat-height: calc(100vh - 32px) }\n"] }]
         }], ctorParameters: () => [], propDecorators: { messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], draftMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "draftMessage", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], templates: [{ type: i0.Input, args: [{ isSignal: true, alias: "templates", required: false }] }], messageCreated: [{ type: i0.Output, args: ["messageCreated"] }], attachmentClick: [{ type: i0.Output, args: ["attachmentClick"] }], attachmentDrag: [{ type: i0.Output, args: ["attachmentDrag"] }], attachmentDrop: [{ type: i0.Output, args: ["attachmentDrop"] }], typingChange: [{ type: i0.Output, args: ["typingChange"] }], inputFocus: [{ type: i0.Output, args: ["inputFocus"] }], inputBlur: [{ type: i0.Output, args: ["inputBlur"] }], inputChange: [{ type: i0.Output, args: ["inputChange"] }] } });
 class IgxChatMessageContextDirective {
     static ngTemplateContextGuard(_, ctx) {