@koobiq/components 19.8.6 → 19.8.8

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@koobiq/components",
-    "version": "19.8.6",
+    "version": "19.8.8",
     "description": "koobiq",
     "repository": {
         "type": "git",
@@ -25,9 +25,9 @@
         "@angular/cdk": ">=19.0.0",
         "@angular/core": ">=19.0.0",
         "@angular/forms": ">=19.0.0",
-        "@koobiq/cdk": "19.8.6",
-        "@koobiq/angular-moment-adapter": "19.8.6",
-        "@koobiq/angular-luxon-adapter": "19.8.6",
+        "@koobiq/cdk": "19.8.8",
+        "@koobiq/angular-moment-adapter": "19.8.8",
+        "@koobiq/angular-luxon-adapter": "19.8.8",
         "@koobiq/date-formatter": "^3.2.3",
         "@koobiq/icons": "^11.1.3",
         "@koobiq/design-tokens": "^3.14.0"

package/schematics/ng-add/index.js

@@ -27,8 +27,8 @@ function ngAdd(options) {
         }
         // Installing dependencies
         utils_packageConfig.addPackageToPackageJson(tree, '@angular/cdk', "^19.2.19");
-        utils_packageConfig.addPackageToPackageJson(tree, '@koobiq/cdk', "^19.8.6");
-        utils_packageConfig.addPackageToPackageJson(tree, '@koobiq/angular-luxon-adapter', "^19.8.6");
+        utils_packageConfig.addPackageToPackageJson(tree, '@koobiq/cdk', "^19.8.8");
+        utils_packageConfig.addPackageToPackageJson(tree, '@koobiq/angular-luxon-adapter', "^19.8.8");
         utils_packageConfig.addPackageToPackageJson(tree, '@koobiq/date-formatter', "^3.5.1");
         utils_packageConfig.addPackageToPackageJson(tree, '@koobiq/date-adapter', "^3.5.1");
         utils_packageConfig.addPackageToPackageJson(tree, '@koobiq/icons', "^11.5.0");

package/select/select-option.directive.d.ts

@@ -2,6 +2,11 @@ import { AfterViewInit, OnDestroy } from '@angular/core';
 import { KbqTooltipTrigger } from '@koobiq/components/tooltip';
 import * as i0 from "@angular/core";
 export declare class KbqOptionTooltip extends KbqTooltipTrigger implements AfterViewInit, OnDestroy {
+    /**
+     * The hint repeats text the option had to clip, so `kbqTooltipDisabled="false"` cannot conjure one for an
+     * option that fits.
+     * @docs-private */
+    protected readonly derivedDisabledWins = true;
     private readonly option;
     private readonly resizeObserver;
     private readonly contentObserver;

package/select/select.component.d.ts

@@ -112,6 +112,13 @@ export declare class KbqSelect extends KbqAbstractSelect implements AfterContent
     readonly stateChanges: Subject<void>;
     /** A name for this control that can be used by `kbq-form-field`. */
     controlType: string;
+    /**
+     * A `kbq-select` is not a native labelable element, so the form-field's `<label for>` cannot
+     * associate with it. The select is named through `aria-labelledby` instead.
+     */
+    readonly isNativeLabelSupported = false;
+    /** `aria-labelledby` set on the host by the consumer, which outranks the form-field caption. */
+    private readonly ariaLabelledbyAttribute;
     hiddenItems: number;
     /** The last measured value for the trigger's client bounding rect. */
     triggerRect: DOMRect;
@@ -350,6 +357,14 @@ export declare class KbqSelect extends KbqAbstractSelect implements AfterContent
     get isEmptySearchResult(): boolean;
     /** Whether the cleaner (clear button) should be shown. */
     get canShowCleaner(): boolean;
+    /**
+     * Id of the `kbq-form-field` caption naming this select, when it has one.
+     *
+     * A `<label for>` does not associate with a custom element, so the relationship is expressed the
+     * other way around — from the control to the label.
+     * @docs-private
+     */
+    protected get ariaLabelledby(): string | null;
     /** Returns the currently selected option(s). Single value or array for multiple selection. */
     get selected(): KbqOptionBase | KbqOptionBase[];
     /** Returns the display value for the trigger element. */
@@ -364,6 +379,12 @@ export declare class KbqSelect extends KbqAbstractSelect implements AfterContent
     get firstSelected(): KbqOptionBase | null;
     /** Whether the first selected option is filtered (not visible in the list). */
     get firstFiltered(): boolean;
+    /**
+     * Whether the legacy `KbqValidateDirective` marks this control. The class it writes never changes
+     * after the host is created, so it is probed once instead of on every change detection pass.
+     */
+    private hasLegacyValidateDirective;
+    private readonly invalidState;
     /** @docs-private */
     get colorForState(): KbqComponentColors;
     /** Whether multiple choice is enabled. True if multiple or multiline mode is active. */
@@ -398,6 +419,7 @@ export declare class KbqSelect extends KbqAbstractSelect implements AfterContent
     ngOnDestroy(): void;
     /** Updates the error state based on the error state matcher. */
     updateErrorState(): void;
+    private syncInvalidState;
     /**
      * Formats the hidden items text with the number of hidden items.
      * @param hiddenItemsText Template string with {{ number }} placeholder.

package/time-range/time-range-title-as-form-field.d.ts

@@ -10,9 +10,12 @@ export declare class KbqTimeRangeTitlePlaceholder {
 /** Component simulates `KbqFormFieldControl` allowing to provide custom content inside `KbqFormField` */
 export declare class KbqTimeRangeTitleAsControl implements KbqFormFieldControl<any> {
     private timeRange;
+    private readonly parentFormField;
     /** @docs-private */
     controlType: string;
     /** @docs-private */
+    readonly isNativeLabelSupported = false;
+    /** @docs-private */
     stateChanges: Observable<void>;
     /** @docs-private */
     ngControl: NgControl | null;
@@ -36,6 +39,14 @@ export declare class KbqTimeRangeTitleAsControl implements KbqFormFieldControl<a
     onContainerClick(_event: MouseEvent): void;
     /** @docs-private */
     focus(_options?: FocusOptions): void;
+    /**
+     * Id of the `kbq-form-field` caption naming this control, when it has one.
+     *
+     * A `<label for>` does not associate with a custom element, so the relationship is expressed the
+     * other way around — from the control to the label.
+     * @docs-private
+     */
+    protected get ariaLabelledby(): string | null;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimeRangeTitleAsControl, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<KbqTimeRangeTitleAsControl, "kbq-time-range-title-as-control", never, {}, {}, never, ["*"], true, never>;
 }

package/timezone/timezone-option.directive.d.ts

@@ -3,6 +3,11 @@ import { KbqTooltipTrigger } from '@koobiq/components/tooltip';
 import * as i0 from "@angular/core";
 export declare const TOOLTIP_VISIBLE_ROWS_COUNT = 3;
 export declare class KbqTimezoneOptionTooltip extends KbqTooltipTrigger implements AfterViewInit, OnDestroy {
+    /**
+     * The hint shows rows the option had to clip, so `kbqTooltipDisabled="false"` cannot conjure one for an
+     * option that fits.
+     * @docs-private */
+    protected readonly derivedDisabledWins = true;
     private readonly option;
     private readonly changeDetectorRef;
     private readonly resizeObserver;

package/title/title.directive.d.ts

@@ -5,6 +5,11 @@ import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
 export declare class KbqTitleDirective extends KbqTooltipTrigger implements AfterViewInit, OnDestroy {
     private componentInstance?;
+    /**
+     * The hint repeats text the host had to clip, so `kbqTooltipDisabled="false"` cannot conjure one for a
+     * fully visible title.
+     * @docs-private */
+    protected readonly derivedDisabledWins = true;
     private readonly nativeElement;
     /** SSR-safe window reference used for `getComputedStyle` reads. */
     private readonly window;

package/toast/toast-container.component.d.ts

@@ -1,6 +1,5 @@
 import { CdkScrollable, ScrollDispatcher } from '@angular/cdk/overlay';
 import { ChangeDetectorRef, ComponentRef, ElementRef, EmbeddedViewRef, Injector, NgZone, TemplateRef, ViewContainerRef, ViewRef } from '@angular/core';
-import { Observable } from 'rxjs';
 import { KbqToastService } from './toast.service';
 import { KbqToastData } from './toast.type';
 import * as i0 from "@angular/core";
@@ -9,34 +8,24 @@ export declare class KbqToastContainerComponent extends CdkScrollable {
     private changeDetectorRef;
     readonly service: KbqToastService;
     viewContainer: ViewContainerRef;
-    /**
-     * Emits while the stack re-lays-out. Toasts are ordinary flow children, so removing one slides the
-     * rest for as long as its height animates — and an overlay opened from inside a toast is anchored to
-     * a trigger that is moving. CDK only re-measures the origin on a scroll or a viewport resize, so the
-     * stack has to say when it moved.
-     *
-     * The container's own box tracks the reflow exactly: continuously while a leaving toast animates its
-     * height away, and once for a removal that is not animated at all, such as a template toast.
-     */
-    private readonly reflowed;
+    private readonly overlayKeyboardDispatcher;
     constructor(injector: Injector, changeDetectorRef: ChangeDetectorRef, service: KbqToastService, elementRef: ElementRef<HTMLElement>, scrollDispatcher: ScrollDispatcher, ngZone: NgZone);
-    /**
-     * `ScrollDispatcher` subscribes to this method when the container registers itself, so merging the
-     * reflow signal in re-broadcasts it to every overlay that repositions on scroll — which is what
-     * `kbq-select` and the dropdown trigger do by default.
-     */
-    elementScrolled(): Observable<Event>;
     createToast<C>(data: KbqToastData, componentType: any, onTop: boolean): ComponentRef<C>;
     createTemplate<C>(data: KbqToastData, template: TemplateRef<any>, onTop: boolean): EmbeddedViewRef<C>;
     remove(viewRef: ViewRef): void;
     getInjector(data: KbqToastData): Injector;
+    /**
+     * Re-applies the position of every overlay anchored to an element; one whose origin has not moved stays where it
+     * is. CDK keeps no public registry of attached overlays, but its keyboard dispatcher tracks each of them.
+     */
+    private repositionConnectedOverlays;
     /**
      * Fakes a scroll on the container so that overlays anchored inside a toast are repositioned by their
      * `RepositionScrollStrategy` when the stack shifts.
      *
-     * @deprecated The container reports its own reflow through `elementScrolled()`, so nothing calls this.
+     * @deprecated The container repositions the overlays anchored inside it on its own, so nothing calls this.
      * It is kept only for callers that already hold a container reference — the instance created by
-     * `KbqToastService` is not exposed.
+     * `KbqToastService` is not exposed. The fake scroll also closes every close-on-scroll overlay of the app.
      */
     dispatchScrollEvent: () => void;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqToastContainerComponent, never>;

package/tooltip/tooltip.component.d.ts

@@ -1,4 +1,5 @@
 import { FocusMonitor } from '@angular/cdk/a11y';
+import { BooleanInput } from '@angular/cdk/coercion';
 import { Overlay, OverlayConfig, ScrollStrategy } from '@angular/cdk/overlay';
 import { AfterViewInit, ElementRef, EventEmitter, InjectionToken, OnDestroy, Renderer2, TemplateRef, Type, WritableSignal } from '@angular/core';
 import { KbqComponentColors, KbqParentPopup, KbqPopUp, KbqPopUpPlacementValues, KbqPopUpTrigger } from '@koobiq/components/core';
@@ -78,8 +79,24 @@ export declare class KbqTooltipTrigger extends KbqPopUpTrigger<KbqTooltipCompone
     set tooltipPlacementPriority(value: string | string[] | null);
     get content(): string | TemplateRef<any>;
     set content(content: string | TemplateRef<any>);
+    /**
+     * Input (`kbqTooltipDisabled`) controlling whether the tooltip is disabled; setting it to `true` hides it.
+     * `undefined` leaves the decision to the trigger, like an unset input.
+     *
+     * Reads back the *effective* state, which for triggers that derive one of their own (see
+     * `derivedDisabledWins`) is not necessarily the value that was written.
+     */
     get disabled(): boolean;
-    set disabled(value: boolean);
+    set disabled(value: BooleanInput);
+    /**
+     * Whether the state this trigger derives means *there is nothing to show*, so an explicit
+     * `kbqTooltipDisabled="false"` cannot override it, as for a hint that repeats text the host never clipped.
+     * Otherwise the explicit value wins in both directions, so `false` on a wrapped control that is not disabled
+     * still asks for a tooltip.
+     * @docs-private */
+    protected readonly derivedDisabledWins: boolean;
+    private explicitlyDisabled;
+    private derivedDisabled;
     enterDelay: number;
     leaveDelay: number;
     get trigger(): string;
@@ -121,6 +138,13 @@ export declare class KbqTooltipTrigger extends KbqPopUpTrigger<KbqTooltipCompone
     getOverlayHandleComponentType(): Type<KbqTooltipComponent>;
     updateClassMap(newPlacement?: string): void;
     protected applyRelativeToPointer(): void;
+    /**
+     * Records the state this trigger derives from what it renders — the wrapped control being disabled, text
+     * overflow in `KbqTitleDirective` and the option tooltips — without overwriting `kbqTooltipDisabled`.
+     * @docs-private */
+    protected setDerivedDisabled(value: boolean): void;
+    private applyDisabled;
+    private foldDisabled;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTooltipTrigger, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqTooltipTrigger, "[kbqTooltip]", ["kbqTooltip"], { "forDisabledComponent": { "alias": "forDisabledComponent"; "required": false; "isSignal": true; }; "ignoreTooltipPointerEvents": { "alias": "ignoreTooltipPointerEvents"; "required": false; "isSignal": true; }; "hideWithTimeout": { "alias": "hideWithTimeout"; "required": false; }; "tooltipVisible": { "alias": "kbqVisible"; "required": false; }; "tooltipPlacement": { "alias": "kbqPlacement"; "required": false; }; "relativeToPointer": { "alias": "kbqRelativeToPointer"; "required": false; }; "tooltipPlacementPriority": { "alias": "kbqPlacementPriority"; "required": false; }; "content": { "alias": "kbqTooltip"; "required": false; }; "disabled": { "alias": "kbqTooltipDisabled"; "required": false; }; "enterDelay": { "alias": "kbqEnterDelay"; "required": false; }; "leaveDelay": { "alias": "kbqLeaveDelay"; "required": false; }; "trigger": { "alias": "kbqTrigger"; "required": false; }; "customClass": { "alias": "kbqTooltipClass"; "required": false; }; "context": { "alias": "kbqTooltipContext"; "required": false; }; "color": { "alias": "kbqTooltipColor"; "required": false; }; "arrow": { "alias": "kbqTooltipArrow"; "required": false; }; "offset": { "alias": "kbqTooltipOffset"; "required": false; }; }, { "placementChange": "kbqPlacementChange"; "visibleChange": "kbqVisibleChange"; }, never, never, true, never>;
     static ngAcceptInputType_hideWithTimeout: unknown;

package/tree-select/tree-select.component.d.ts

@@ -93,6 +93,13 @@ export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterCon
     readonly stateChanges: Subject<void>;
     /** A name for this control that can be used by `kbq-form-field`. */
     controlType: string;
+    /**
+     * A `kbq-tree-select` is not a native labelable element, so the form-field's `<label for>` cannot
+     * associate with it. The control is named through `aria-labelledby` instead.
+     */
+    readonly isNativeLabelSupported = false;
+    /** `aria-labelledby` set on the host by the consumer, which outranks the form-field caption. */
+    private readonly ariaLabelledbyAttribute;
     hiddenItems: number;
     /** The last measured value for the trigger's client bounding rect. */
     triggerRect: DOMRect;
@@ -236,6 +243,14 @@ export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterCon
     private _searchMinOptionsThreshold;
     get panelOpen(): boolean;
     get canShowCleaner(): boolean;
+    /**
+     * Id of the `kbq-form-field` caption naming this control, when it has one.
+     *
+     * A `<label for>` does not associate with a custom element, so the relationship is expressed the
+     * other way around — from the control to the label.
+     * @docs-private
+     */
+    protected get ariaLabelledby(): string | null;
     /** @docs-private */
     get colorForState(): KbqComponentColors;
     isEmptySearchResult: boolean;