@koobiq/components 18.30.0 → 18.32.0

package/actions-panel/actions-panel-config.d.ts

@@ -38,6 +38,8 @@ export declare class KbqActionsPanelConfig<D = unknown> {
     closeOnNavigation?: boolean;
     /**
      * Overlay container element in which the actions panel are rendered.
+     *
+     * @default `document.body`
      */
     overlayContainer?: ElementRef<HTMLElement>;
     /**

package/actions-panel/actions-panel.d.ts

@@ -1,8 +1,5 @@
-import { Directionality } from '@angular/cdk/bidi';
-import { Dialog, DialogConfig } from '@angular/cdk/dialog';
-import { ComponentType, Overlay, OverlayContainer, OverlayKeyboardDispatcher, OverlayOutsideClickDispatcher, OverlayPositionBuilder, ScrollStrategyOptions } from '@angular/cdk/overlay';
-import { Location } from '@angular/common';
-import { ComponentFactoryResolver, InjectionToken, Injector, NgZone, OnDestroy, TemplateRef } from '@angular/core';
+import { ComponentType } from '@angular/cdk/overlay';
+import { InjectionToken, OnDestroy, TemplateRef } from '@angular/core';
 import { KbqActionsPanelConfig } from './actions-panel-config';
 import { KbqActionsPanelRef } from './actions-panel-ref';
 import * as i0 from "@angular/core";
@@ -57,64 +54,13 @@ export declare const KBQ_ACTIONS_PANEL_OVERLAY_SELECTOR = "kbq-actions-panel-ove
  * @docs-private
  */
 export declare const KBQ_ACTIONS_PANEL_OVERLAY_CONTAINER_SELECTOR = "kbq-actions-panel-overlay-container";
-/**
- * Actions panel overlay container.
- *
- * @docs-private
- */
-export declare class KbqActionsPanelOverlayContainer extends OverlayContainer {
-    /**
-     * Set the overlay container element.
-     *
-     * @param containerElement The element into which the overlay will be rendered.
-     * @returns Current OverlayContainer instance.
-     */
-    setContainerElement(containerElement?: HTMLElement): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqActionsPanelOverlayContainer, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<KbqActionsPanelOverlayContainer>;
-}
-/**
- * Actions panel overlay.
- *
- * @docs-private
- */
-export declare class KbqActionsPanelOverlay extends Overlay {
-    private readonly overlayContainer;
-    constructor(scrollStrategies: ScrollStrategyOptions, overlayContainer: KbqActionsPanelOverlayContainer, componentFactoryResolver: ComponentFactoryResolver, positionBuilder: OverlayPositionBuilder, keyboardDispatcher: OverlayKeyboardDispatcher, injector: Injector, ngZone: NgZone, document: any, directionality: Directionality, location: Location, outsideClickDispatcher: OverlayOutsideClickDispatcher, animationsModuleType?: string);
-    /**
-     * Set the overlay container element.
-     *
-     * @param containerElement The element into which the overlay will be rendered.
-     * @returns Current Overlay instance.
-     */
-    setOverlayContainerElement(containerElement?: HTMLElement): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqActionsPanelOverlay, [null, null, null, null, null, null, null, null, null, null, null, { optional: true; }]>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<KbqActionsPanelOverlay>;
-}
-/**
- * Actions panel dialog service.
- *
- * @docs-private
- */
-export declare class KbqActionsPanelDialog extends Dialog {
-    private readonly overlay;
-    constructor(overlay: KbqActionsPanelOverlay, injector: Injector, defaultOptions: DialogConfig, parentDialog: Dialog, overlayContainer: KbqActionsPanelOverlayContainer, scrollStrategy: any);
-    /**
-     * Set the dialog overlay container element.
-     *
-     * @param containerElement The element into which the overlay will be rendered.
-     * @returns Current dialog instance.
-     */
-    setOverlayContainerElement(containerElement?: HTMLElement): this;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqActionsPanelDialog, [null, null, { optional: true; }, { optional: true; skipSelf: true; }, null, null]>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<KbqActionsPanelDialog>;
-}
 /**
  * Service for opening actions panel.
  */
 export declare class KbqActionsPanel implements OnDestroy {
     private readonly injector;
     private readonly overlay;
+    private readonly overlayContainer;
     private readonly dialog;
     private readonly defaultConfig;
     /** The reference to the currently opened actions panel. */

package/autocomplete/autocomplete-trigger.directive.d.ts

@@ -1,7 +1,7 @@
 import { Directionality } from '@angular/cdk/bidi';
 import { Overlay, ScrollStrategy } from '@angular/cdk/overlay';
 import { ViewportRuler } from '@angular/cdk/scrolling';
-import { AfterViewInit, ChangeDetectorRef, ElementRef, InjectionToken, NgZone, OnDestroy, ViewContainerRef } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, InjectionToken, NgZone, OnDestroy, Provider, ViewContainerRef } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 import { KbqOption, KbqOptionSelectionChange, KeyboardNavigationHandler } from '@koobiq/components/core';
 import { KbqFormField } from '@koobiq/components/form-field';
@@ -28,7 +28,7 @@ export declare const KBQ_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER: {
  * Provider that allows the autocomplete to register as a ControlValueAccessor.
  * @docs-private
  */
-export declare const MAT_AUTOCOMPLETE_VALUE_ACCESSOR: any;
+export declare const KBQ_AUTOCOMPLETE_VALUE_ACCESSOR: Provider;
 /**
  * Creates an error to be thrown when attempting to use an autocomplete trigger without a panel.
  * @docs-private
@@ -94,6 +94,7 @@ export declare class KbqAutocompleteTrigger implements AfterViewInit, ControlVal
     private canOpenOnNextFocus;
     /** Stream of keyboard events that can close the panel. */
     private readonly closeKeyEventStream;
+    private readonly window;
     constructor(elementRef: ElementRef<HTMLInputElement>, viewContainerRef: ViewContainerRef, changeDetectorRef: ChangeDetectorRef, overlay: Overlay, zone: NgZone, scrollStrategy: any, dir: Directionality, formField: KbqFormField, viewportRuler?: ViewportRuler | undefined);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
@@ -157,8 +158,6 @@ export declare class KbqAutocompleteTrigger implements AfterViewInit, ControlVal
      */
     private resetActiveItem;
     private canOpen;
-    /** Use defaultView of injected document if available or fallback to global window reference */
-    private getWindow;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqAutocompleteTrigger, [null, null, null, null, null, null, { optional: true; }, { optional: true; host: true; }, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqAutocompleteTrigger, "input[kbqAutocomplete], textarea[kbqAutocomplete]", ["kbqAutocompleteTrigger"], { "autocomplete": { "alias": "kbqAutocomplete"; "required": false; }; "connectedTo": { "alias": "kbqAutocompleteConnectedTo"; "required": false; }; "autocompleteAttribute": { "alias": "autocomplete"; "required": false; }; "autocompleteDisabled": { "alias": "kbqAutocompleteDisabled"; "required": false; }; "onInputBlur": { "alias": "kbqAutocompleteOnBlur"; "required": false; }; }, {}, never, never, false, never>;
 }

package/autocomplete/autocomplete.component.d.ts

@@ -20,6 +20,7 @@ export declare class KbqAutocomplete implements AfterContentInit {
     private changeDetectorRef;
     private elementRef;
     private readonly parentFormField;
+    private readonly destroyRef;
     /** Unique ID to be used by autocomplete trigger's "aria-owns" property. */
     id: string;
     /** Manages active item in option list based on key events. */

package/autocomplete/autocomplete.module.d.ts

@@ -7,6 +7,6 @@ import * as i5 from "@angular/cdk/overlay";
 import * as i6 from "@angular/common";
 export declare class KbqAutocompleteModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqAutocompleteModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqAutocompleteModule, [typeof i1.KbqAutocomplete, typeof i2.KbqAutocompleteTrigger, typeof i3.KbqAutocompleteOrigin], [typeof i4.KbqOptionModule, typeof i5.OverlayModule, typeof i4.KbqCommonModule, typeof i6.NgClass], [typeof i1.KbqAutocomplete, typeof i4.KbqOptionModule, typeof i2.KbqAutocompleteTrigger, typeof i3.KbqAutocompleteOrigin, typeof i4.KbqCommonModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqAutocompleteModule, [typeof i1.KbqAutocomplete, typeof i2.KbqAutocompleteTrigger, typeof i3.KbqAutocompleteOrigin], [typeof i4.KbqOptionModule, typeof i5.OverlayModule, typeof i6.NgClass], [typeof i1.KbqAutocomplete, typeof i4.KbqOptionModule, typeof i2.KbqAutocompleteTrigger, typeof i3.KbqAutocompleteOrigin]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<KbqAutocompleteModule>;
 }

package/button-toggle/button-toggle.module.d.ts

@@ -1,10 +1,9 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./button-toggle.component";
-import * as i2 from "@koobiq/components/core";
-import * as i3 from "@koobiq/components/button";
-import * as i4 from "@koobiq/components/title";
+import * as i2 from "@koobiq/components/button";
+import * as i3 from "@koobiq/components/title";
 export declare class KbqButtonToggleModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqButtonToggleModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqButtonToggleModule, [typeof i1.KbqButtonToggleGroup, typeof i1.KbqButtonToggle], [typeof i2.KbqCommonModule, typeof i3.KbqButtonModule, typeof i4.KbqTitleModule], [typeof i2.KbqCommonModule, typeof i1.KbqButtonToggleGroup, typeof i1.KbqButtonToggle]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqButtonToggleModule, [typeof i1.KbqButtonToggleGroup, typeof i1.KbqButtonToggle], [typeof i2.KbqButtonModule, typeof i3.KbqTitleModule], [typeof i1.KbqButtonToggleGroup, typeof i1.KbqButtonToggle]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<KbqButtonToggleModule>;
 }

package/code-block/code-block-highlight.d.ts

@@ -17,6 +17,7 @@ export declare class KbqCodeBlockHighlight {
     private readonly renderer;
     private readonly domSanitizer;
     private readonly fallbackFileLanguage;
+    private readonly window;
     /** The code file. */
     set file(file: KbqCodeBlockFile);
     /** The starting line number. */
@@ -24,8 +25,6 @@ export declare class KbqCodeBlockHighlight {
     /** Whether to display line numbers for single line code block. */
     singleLine: boolean;
     constructor();
-    /** Use defaultView of injected document if available or fallback to global window reference */
-    private getWindow;
     /**
      * Initialize the HighlightJS line numbers plugin. This method is called once when
      * the component is constructed.

package/code-block/code-block.d.ts

@@ -17,6 +17,9 @@ export declare const kbqCodeBlockFallbackFileNameProvider: (fileName: string) =>
  */
 export declare class KbqCodeBlock implements AfterViewInit {
     private readonly copyButtonTooltip?;
+    /**
+     * Reference to the scrollable code content.
+     */
     readonly scrollableCodeContent: CdkScrollable;
     /** Whether to display line numbers. */
     lineNumbers: boolean;
@@ -26,28 +29,41 @@ export declare class KbqCodeBlock implements AfterViewInit {
     canToggleSoftWrap: boolean;
     /** Whether sequences of whitespace should be preserved. */
     softWrap: boolean;
-    /** Event emitted when `softWrap` is changed. */
+    /**
+     * Output to support two-way binding on `[(softWrap)]` property.
+     */
     readonly softWrapChange: EventEmitter<boolean>;
     /**
      * Allows to view all the code, otherwise it will be hidden.
      * Works only with `maxHeight` property.
      */
     viewAll: boolean;
-    /** Event emitted when `viewAll` is changed. */
+    /**
+     * Output to support two-way binding on `[(viewAll)]` property.
+     */
     readonly viewAllChange: EventEmitter<boolean>;
     /**
      * Maximum height of the code block content, other parts will be hidden.
      * Can be toggled by `viewAll` property.
      */
     maxHeight: number;
+    /**
+     * @docs-private
+     */
     protected get calculatedMaxHeight(): number | null;
-    /** @deprecated Will be removed in next major release, use `canDownload` instead. */
+    /**
+     * @deprecated Will be removed in next major release, use `canDownload` instead.
+     *
+     * @docs-private
+     */
     set canLoad(value: boolean);
     /** Added download code button. */
     canDownload: boolean;
     /** Added copy code button. */
     canCopy: boolean;
-    /** @deprecated Will be removed in next major release, use `files` instead. */
+    /**
+     * @deprecated Will be removed in next major release, use `files` instead.
+     */
     set codeFiles(files: KbqCodeBlockFile[]);
     /**
      * @TODO Mark as `required`, after removing `codeFiles`
@@ -59,6 +75,9 @@ export declare class KbqCodeBlock implements AfterViewInit {
     private _files;
     /** Defines which file (index) is active. */
     activeFileIndex: number;
+    /**
+     * Output to support two-way binding on `[(activeFileIndex)]` property.
+     */
     readonly activeFileIndexChange: EventEmitter<number>;
     /** Whether to hide border. */
     noBorder: boolean;
@@ -70,10 +89,18 @@ export declare class KbqCodeBlock implements AfterViewInit {
     get hideTabs(): boolean;
     set hideTabs(value: boolean);
     private _hideTabs;
-    /** Component locale configuration. */
+    /**
+     * Component locale configuration.
+     *
+     * @docs-private
+     */
     protected get localeConfiguration(): KbqCodeBlockLocaleConfiguration;
     private _localeConfiguration;
-    /** Code content tab index. */
+    /**
+     * Code content tab index.
+     *
+     * @docs-private
+     */
     protected get codeContentTabIndex(): number;
     /**
      * Determines whether the code content can be focused.
@@ -82,7 +109,13 @@ export declare class KbqCodeBlock implements AfterViewInit {
      * has a scroll, and the calculated maximum height is not set.
      */
     private get canCodeContentBeFocused();
+    /**
+     * @docs-private
+     */
     protected readonly componentColor: typeof KbqComponentColors;
+    /**
+     * @docs-private
+     */
     protected readonly buttonStyle: typeof KbqButtonStyles;
     private readonly elementRef;
     private readonly changeDetectorRef;
@@ -94,7 +127,11 @@ export declare class KbqCodeBlock implements AfterViewInit {
     private readonly clipboard;
     private readonly domSanitizer;
     private readonly document;
+    /**
+     * @docs-private
+     */
     protected readonly fallbackFileName: string;
+    private readonly window;
     constructor();
     ngAfterViewInit(): void;
     /**
@@ -120,6 +157,8 @@ export declare class KbqCodeBlock implements AfterViewInit {
      * and scrolling to the top of the scrollable content.
      *
      * @param index - The index of the newly selected tab.
+     *
+     * @docs-private
      */
     protected onSelectedTabChange(index: number): void;
     /**
@@ -147,18 +186,26 @@ export declare class KbqCodeBlock implements AfterViewInit {
     private setupActionbarDisplay;
     /** Whether the element has scroll. */
     private hasScroll;
-    /** Handles the enter keydown event on `viewAll` button. */
-    protected onViewAllEnterKeydown(): void;
+    /**
+     * Handles the enter keydown event on `viewAll` button.
+     *
+     * @docs-private
+     */
+    protected onViewAllEnterKeydown(event: Event): void;
     private updateLocaleParams;
     /**
      * Copies the file code to the clipboard.
      *
      * If the copy was successful, the copy button tooltip content is updated
      * to show the "copied" message.
+     *
+     * @docs-private
      */
     protected copyCode(): void;
     /**
      * Opens the file link in a new window.
+     *
+     * @docs-private
      */
     protected openLink(): void;
     /**
@@ -166,10 +213,10 @@ export declare class KbqCodeBlock implements AfterViewInit {
      *
      * Creates a link with a blob as href and the file name as download attribute.
      * Then simulates a click event on the link to initiate the download.
+     *
+     * @docs-private
      */
     protected downloadCode(): void;
-    /** Use defaultView of injected document if available or fallback to global window reference */
-    private getWindow;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqCodeBlock, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<KbqCodeBlock, "kbq-code-block", ["kbqCodeBlock"], { "lineNumbers": { "alias": "lineNumbers"; "required": false; }; "filled": { "alias": "filled"; "required": false; }; "canToggleSoftWrap": { "alias": "canToggleSoftWrap"; "required": false; }; "softWrap": { "alias": "softWrap"; "required": false; }; "viewAll": { "alias": "viewAll"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "canLoad": { "alias": "canLoad"; "required": false; }; "canDownload": { "alias": "canDownload"; "required": false; }; "canCopy": { "alias": "canCopy"; "required": false; }; "codeFiles": { "alias": "codeFiles"; "required": false; }; "files": { "alias": "files"; "required": false; }; "activeFileIndex": { "alias": "activeFileIndex"; "required": false; }; "noBorder": { "alias": "noBorder"; "required": false; }; "hideTabs": { "alias": "hideTabs"; "required": false; }; }, { "softWrapChange": "softWrapChange"; "viewAllChange": "viewAllChange"; "activeFileIndexChange": "activeFileIndexChange"; }, never, never, true, never>;
     static ngAcceptInputType_lineNumbers: unknown;

package/core/common-behaviors/color.d.ts

@@ -33,6 +33,9 @@ export declare enum KbqComponentColors {
 /** Mixin to augment a directive with a `color` property. */
 export declare function mixinColor<T extends AbstractConstructor<HasElementRef>>(base: T, defaultColor?: KbqComponentColors | ThemePalette): CanColorCtor & T;
 export declare class KbqColorDirective {
+    /**
+     * @docs-private
+     */
     readonly elementRef: ElementRef<any>;
     private defaultColor;
     get colorClassName(): KbqComponentColors | ThemePalette | string;

package/core/common-behaviors/common-module.d.ts

@@ -1,24 +1,37 @@
 import { InjectionToken } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/cdk/bidi";
+/**
+ * Injection token that configures whether the koobiq sanity checks are enabled.
+ *
+ * @deprecated No longer used and will be removed in next major release.
+ *
+ * @docs-private
+ */
 export declare const KBQ_SANITY_CHECKS: InjectionToken<boolean>;
+/**
+ * @deprecated No longer used and will be removed in next major release.
+ *
+ * @docs-private
+ */
 export declare function mcSanityChecksFactory(): boolean;
 /**
  * Module that captures anything that should be loaded and/or run for *all* Koobiq
  * components. This includes Bidi, etc.
  *
- * This module should be imported to each top-level component module (e.g., KbqTabsModule).
+ * @deprecated No longer used and will be removed in next major release.
+ *
+ * @docs-private
  */
 export declare class KbqCommonModule {
     private _sanityChecksEnabled;
     protected readonly document: Document;
+    private readonly window;
     private hasDoneGlobalChecks;
     constructor(_sanityChecksEnabled: boolean);
     private areChecksEnabled;
     private isTestEnv;
     private checkDoctypeIsDefined;
-    private checkThemeIsPresent;
-    private getWindow;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqCommonModule, [{ optional: true; }]>;
     static ɵmod: i0.ɵɵNgModuleDeclaration<KbqCommonModule, never, [typeof i1.BidiModule], [typeof i1.BidiModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<KbqCommonModule>;

package/core/common-behaviors/error-state.d.ts

@@ -26,3 +26,21 @@ export interface HasErrorState {
  * For component with `errorState` and need to update `errorState`.
  */
 export declare function mixinErrorState<T extends AbstractConstructor<HasErrorState>>(base: T): CanUpdateErrorStateCtor & T;
+/**
+ * Class that tracks the error state of a component.
+ * @docs-private
+ */
+export declare class KbqErrorStateTracker implements CanUpdateErrorState {
+    private defaultMatcher;
+    ngControl: NgControl | null;
+    private parentFormGroup;
+    private parentForm;
+    private stateChanges;
+    /** Whether the tracker is currently in an error state. */
+    errorState: boolean;
+    /** User-defined matcher for the error state. */
+    errorStateMatcher: ErrorStateMatcher;
+    constructor(defaultMatcher: ErrorStateMatcher | null, ngControl: NgControl | null, parentFormGroup: FormGroupDirective | null, parentForm: NgForm | null, stateChanges: Subject<void>);
+    /** Updates the error state based on the provided error state matcher. */
+    updateErrorState(): void;
+}

package/core/common-behaviors/index.d.ts

@@ -4,7 +4,7 @@ export * from './clipboard';
 export { CanColor, CanColorCtor, KbqColorDirective, KbqComponentColors, mixinColor, ThemePalette } from './color';
 export { KBQ_SANITY_CHECKS, KbqCommonModule } from './common-module';
 export { CanDisable, CanDisableCtor, mixinDisabled } from './disabled';
-export { CanUpdateErrorState, CanUpdateErrorStateCtor, mixinErrorState } from './error-state';
+export { CanUpdateErrorState, CanUpdateErrorStateCtor, KbqErrorStateTracker, mixinErrorState } from './error-state';
 export { KbqDefaultSizes } from './size';
 export { HasTabIndex, HasTabIndexCtor, mixinTabIndex } from './tabindex';
 export declare const KBQ_PARENT_ANIMATION_COMPONENT: InjectionToken<any>;

package/core/form-field/form-field-ref.d.ts

@@ -1,4 +1,7 @@
 import { InjectionToken } from '@angular/core';
+/**
+ * @deprecated Will be removed in next major release, use `KbqFormField` instead.
+ */
 export interface KbqFormFieldRef {
     control: any;
     canCleanerClearByEsc: boolean;
@@ -13,12 +16,11 @@ export interface KbqFormFieldRef {
      */
     focusViaKeyboard(): void;
 }
-/**
- * @TODO move into form-field.ts, add correct type for `InjectionToken<KbqFormField>` (#DS-2915)
- */
 /**
  * Injection token that can be used to inject an instances of `KbqFormField`. It serves
  * as alternative token to the actual `KbqFormField` class which would cause unnecessary
  * retention of the `KbqFormField` class and its component metadata.
+ *
+ * @TODO move into form-field.ts, add correct type for `InjectionToken<KbqFormField>` (#DS-2915)
  */
 export declare const KBQ_FORM_FIELD_REF: InjectionToken<KbqFormFieldRef>;

package/core/option/_option-theme.scss

@@ -24,12 +24,20 @@
             @include kbq-option(states-hover);
         }
 
-        &.kbq-selected {
+        &:active:not(.kbq-disabled) {
+            @include kbq-option(states-active);
+        }
+
+        &.kbq-selected:not(.kbq-disabled) {
             @include kbq-option(states-selected);
 
-            &:hover:not(.kbq-disabled) {
+            &:hover {
                 @include kbq-option(states-selected-hover);
             }
+
+            &:active {
+                @include kbq-option(states-selected-active);
+            }
         }
 
         &.kbq-disabled {
@@ -47,6 +55,20 @@
         }
     }
 
+    .kbq-option-multiple {
+        &.kbq-selected:not(.kbq-disabled) {
+            @include kbq-option(multiple-states-selected);
+
+            &:hover {
+                @include kbq-option(multiple-states-selected-hover);
+            }
+
+            &:active {
+                @include kbq-option(multiple-states-selected-active);
+            }
+        }
+    }
+
     .cdk-keyboard-focused {
         .kbq-option.kbq-focused,
         .kbq-option.kbq-active {

package/core/option/option.d.ts

@@ -99,8 +99,8 @@ export declare class KbqOption extends KbqOptionBase implements AfterViewChecked
     ngAfterViewChecked(): void;
     ngOnDestroy(): void;
     getHeight(): number;
-    select(): void;
-    deselect(): void;
+    select(emitEvent?: boolean): void;
+    deselect(emitEvent?: boolean): void;
     focus(): void;
     /**
      * This method sets display styles on the option to make it appear

package/core/public-api.d.ts

@@ -16,6 +16,7 @@ export * from './selection/index';
 export * from './services/measure-scrollbar.service';
 export * from './services/theme.service';
 export * from './title/index';
+export * from './tokens/index';
 export * from './utils/index';
 export * from './validation/index';
 export * from './version';

package/core/selection/pseudo-checkbox/pseudo-checkbox.d.ts

@@ -1,6 +1,6 @@
 import { KbqColorDirective } from '../../common-behaviors';
 import * as i0 from "@angular/core";
-export type KbqPseudoCheckboxState = 'unchecked' | 'checked' | 'indeterminate';
+export type KbqPseudoCheckboxState = 'unchecked' | 'checked' | 'indeterminate' | boolean;
 /**
  * Component that shows a simplified checkbox without including any kind of "real" checkbox.
  * Meant to be used when the checkbox is purely decorative and a large number of them will be

package/core/styles/common/_select.scss

@@ -14,10 +14,9 @@
         @include vendor-prefixes.user-select(none);
 
         display: flex;
+        flex-grow: 1;
         align-items: center;
 
-        width: 100%;
-
         overflow: hidden;
 
         white-space: nowrap;
@@ -36,31 +35,21 @@
 
         cursor: pointer;
 
-        height: calc(var(--kbq-form-field-size-height, var(--kbq-size-3xl)) - calc(var(--kbq-size-border-width) * 2));
+        height: calc(var(--kbq-form-field-size-height) - calc(var(--kbq-size-border-width) * 2));
     }
 
     .kbq-select__trigger.kbq-select__trigger_single,
     .kbq-select__trigger.kbq-select__trigger_multiple.kbq-select__trigger_empty {
         & .kbq-select__matcher {
-            padding: calc(
-                    var(--kbq-select-size-single-padding-vertical, var(--kbq-size-xs)) - var(--kbq-size-border-width)
-                )
-                calc(var(--kbq-select-size-single-padding-right, var(--kbq-size-xxs)) - var(--kbq-size-border-width))
-                calc(var(--kbq-select-size-single-padding-vertical, var(--kbq-size-xs)) - var(--kbq-size-border-width))
-                calc(var(--kbq-select-size-single-padding-left, var(--kbq-size-m)) - var(--kbq-size-border-width));
+            padding: var(--kbq-select-size-single-padding-vertical) var(--kbq-select-size-single-padding-right)
+                var(--kbq-select-size-single-padding-vertical) var(--kbq-select-size-single-padding-left);
         }
     }
 
     .kbq-select__trigger.kbq-select__trigger_multiple:not(.kbq-select__trigger_empty) {
         & .kbq-select__matcher {
-            padding: calc(
-                    var(--kbq-select-size-multiple-padding-vertical, var(--kbq-size-xxs)) - var(--kbq-size-border-width)
-                )
-                calc(var(--kbq-select-size-multiple-padding-right, var(--kbq-size-xxs)) - var(--kbq-size-border-width))
-                calc(
-                    var(--kbq-select-size-multiple-padding-vertical, var(--kbq-size-xxs)) - var(--kbq-size-border-width)
-                )
-                calc(var(--kbq-select-size-multiple-padding-left, var(--kbq-size-xxs)) - var(--kbq-size-border-width));
+            padding: var(--kbq-select-size-multiple-padding-vertical) var(--kbq-select-size-multiple-padding-right)
+                var(--kbq-select-size-multiple-padding-vertical) var(--kbq-select-size-multiple-padding-left);
 
             .kbq-select__match-container {
                 display: flex;
@@ -72,15 +61,11 @@
                 overflow: hidden;
 
                 height: calc(
-                    var(--kbq-form-field-size-height, var(--kbq-size-3xl)) - calc(
-                            var(--kbq-select-size-multiple-padding-vertical, var(--kbq-size-xxs)) * 2
-                        )
+                    var(--kbq-form-field-size-height) - calc(var(--kbq-select-size-multiple-padding-vertical) * 2)
                 );
 
                 max-height: calc(
-                    var(--kbq-form-field-size-height, var(--kbq-size-3xl)) - calc(
-                            var(--kbq-select-size-multiple-padding-vertical, var(--kbq-size-xxs)) * 2
-                        )
+                    var(--kbq-form-field-size-height) - calc(var(--kbq-select-size-multiple-padding-vertical) * 2)
                 );
 
                 gap: var(--kbq-select-size-multiple-content-gap, var(--kbq-size-xxs));
@@ -109,8 +94,9 @@
     .kbq-select__arrow-wrapper {
         display: flex;
         align-self: center;
+        justify-content: center;
 
-        padding: 4px;
+        width: var(--kbq-form-field-size-addon-width);
 
         // When used in a box or standard appearance form-field the arrow should be shifted up 50%.
         .kbq-form-field-appearance-fill &,

package/core/styles/theming/_theming.scss

@@ -48,10 +48,6 @@
         background: var(--kbq-background-bg);
         color: var(--kbq-foreground-contrast);
     }
-
-    .kbq-theme-loaded-marker {
-        display: none;
-    }
 }
 
 @function _theme_foreground($tokens, $scheme) {

package/core/tokens/index.d.ts

@@ -0,0 +1 @@
+export * from './window';

package/core/tokens/window.d.ts

@@ -0,0 +1,5 @@
+import { InjectionToken } from '@angular/core';
+/**
+ * An abstraction over the global `window` object.
+ */
+export declare const KBQ_WINDOW: InjectionToken<Window>;

package/core/validation/validation.d.ts

@@ -1,8 +1,29 @@
-import { InjectionToken } from '@angular/core';
+import { InjectionToken, Provider } from '@angular/core';
+/**
+ * @docs-private
+ */
 export declare const validationTooltipShowDelay = 10;
+/**
+ * @docs-private
+ */
 export declare const validationTooltipHideDelay = 3000;
+/**
+ * @deprecated Will be removed in next major release.
+ *
+ * @docs-private
+ */
 export interface KbqValidationOptions {
     useValidation: boolean;
 }
-/** @deprecated Will be removed in next major release (#DS-2838) */
+/**
+ * @deprecated Will be removed in next major release.
+ *
+ * @docs-private
+ */
 export declare const KBQ_VALIDATION: InjectionToken<KbqValidationOptions>;
+/**
+ * Utility provider which disables legacy validation directive.
+ *
+ * @deprecated Will be removed in next major release.
+ */
+export declare const kbqDisableLegacyValidationDirectiveProvider: () => Provider;