@koobiq/components 17.0.0-rc.2 → 17.0.0-rc.4

package/schematics/ng-add/index.js

@@ -52,13 +52,13 @@ function ngAdd(options) {
         }
         // Installing dependencies
         addPackageToPackageJson(tree, '@angular/cdk', "^17.2.0");
-        addPackageToPackageJson(tree, '@koobiq/cdk', "^17.0.0-rc.2");
-        addPackageToPackageJson(tree, '@koobiq/angular-luxon-adapter', "^17.0.0-rc.2");
+        addPackageToPackageJson(tree, '@koobiq/cdk', "^17.0.0-rc.4");
+        addPackageToPackageJson(tree, '@koobiq/angular-luxon-adapter', "^17.0.0-rc.4");
         addPackageToPackageJson(tree, '@koobiq/date-formatter', "^3.0.2");
         addPackageToPackageJson(tree, '@koobiq/date-adapter', "^3.0.2");
         addPackageToPackageJson(tree, '@koobiq/icons', "^7.1.1");
-        addPackageToPackageJson(tree, '@koobiq/tokens-builder', "^3.0.0-beta.32");
-        addPackageToPackageJson(tree, '@koobiq/design-tokens', "^3.0.0-beta.32");
+        addPackageToPackageJson(tree, '@koobiq/tokens-builder', "^3.0.0-rc.2");
+        addPackageToPackageJson(tree, '@koobiq/design-tokens', "^3.0.0-rc.4");
         addPackageToPackageJson(tree, '@messageformat/core', "^3.0.1");
         addPackageToPackageJson(tree, 'luxon', "^3.4.4");
         addPackageToPackageJson(tree, 'marked', "^4.0.18");

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

@@ -1,3 +1,4 @@
+import { FocusMonitor } from '@angular/cdk/a11y';
 import { Directionality } from '@angular/cdk/bidi';
 import { Overlay, ScrollDispatcher } from '@angular/cdk/overlay';
 import { AfterViewInit, ElementRef, NgZone, OnDestroy, ViewContainerRef } from '@angular/core';
@@ -10,13 +11,13 @@ export declare class KbqOptionTooltip extends KbqTooltipTrigger implements After
     private mutationObserver;
     get textElement(): HTMLElement;
     get isOverflown(): boolean;
-    constructor(option: KbqOption, overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality);
+    constructor(option: KbqOption, overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, focusMonitor: FocusMonitor);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     onMouseEnter(): void;
     onMouseLeave(): void;
     onFocus(): void;
     onBlur(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqOptionTooltip, [null, null, null, null, null, null, null, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqOptionTooltip, [null, null, null, null, null, null, null, { optional: true; }, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqOptionTooltip, "kbq-option", never, {}, {}, never, never, false, never>;
 }

package/splitter/splitter.component.d.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, QueryList, Renderer2 } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, QueryList, Renderer2 } from '@angular/core';
 import * as i0 from "@angular/core";
 interface IArea {
     area: KbqSplitterAreaDirective;
@@ -64,13 +64,15 @@ export declare class KbqSplitterComponent implements OnInit {
     private ngZone;
     private renderer;
     gutterPositionChange: EventEmitter<void>;
-    readonly areas: IArea[];
+    areas: IArea[];
     gutters: QueryList<KbqGutterDirective>;
     ghost: KbqGutterGhostDirective;
+    areaRefs: QueryList<KbqSplitterAreaDirective>;
     get isDragging(): boolean;
     private _isDragging;
     private readonly areaPositionDivider;
     private readonly listeners;
+    private areasChangeSubscription;
     get hideGutters(): boolean;
     set hideGutters(value: boolean);
     private _hideGutters;
@@ -91,18 +93,21 @@ export declare class KbqSplitterComponent implements OnInit {
     constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef, ngZone: NgZone, renderer: Renderer2);
     addArea(area: KbqSplitterAreaDirective): void;
     ngOnInit(): void;
+    ngAfterContentInit(): void;
+    ngOnDestroy(): void;
     onMouseDown(event: MouseEvent, leftAreaIndex: number, rightAreaIndex: number): void;
     removeArea(area: KbqSplitterAreaDirective): void;
     isVertical(): boolean;
+    private mapAndOrderArea;
     private updateGutter;
     private onMouseMove;
     private resizeAreas;
     private onMouseUp;
     private setStyle;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqSplitterComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KbqSplitterComponent, "kbq-splitter", ["kbqSplitter"], { "hideGutters": { "alias": "hideGutters"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "useGhost": { "alias": "useGhost"; "required": false; }; "gutterSize": { "alias": "gutterSize"; "required": false; }; }, { "gutterPositionChange": "gutterPositionChange"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqSplitterComponent, "kbq-splitter", ["kbqSplitter"], { "hideGutters": { "alias": "hideGutters"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "useGhost": { "alias": "useGhost"; "required": false; }; "gutterSize": { "alias": "gutterSize"; "required": false; }; }, { "gutterPositionChange": "gutterPositionChange"; }, ["areaRefs"], ["*"], false, never>;
 }
-export declare class KbqSplitterAreaDirective implements OnInit, OnDestroy {
+export declare class KbqSplitterAreaDirective implements AfterViewInit, OnDestroy {
     private elementRef;
     private renderer;
     private splitter;
@@ -110,7 +115,7 @@ export declare class KbqSplitterAreaDirective implements OnInit, OnDestroy {
     constructor(elementRef: ElementRef, renderer: Renderer2, splitter: KbqSplitterComponent);
     isResizing(): boolean;
     disableFlex(): void;
-    ngOnInit(): void;
+    ngAfterViewInit(): void;
     ngOnDestroy(): void;
     setOrder(order: number): void;
     setSize(size: number): void;

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

@@ -1,3 +1,4 @@
+import { FocusMonitor } from '@angular/cdk/a11y';
 import { Directionality } from '@angular/cdk/bidi';
 import { Overlay, ScrollDispatcher } from '@angular/cdk/overlay';
 import { AfterViewInit, ElementRef, NgZone, OnDestroy, ViewContainerRef, ChangeDetectorRef } from '@angular/core';
@@ -9,12 +10,12 @@ export declare class KbqTimezoneOptionTooltip extends KbqTooltipTrigger implemen
     private changeDetectorRef;
     private option;
     private resizeObserver;
-    constructor(changeDetectorRef: ChangeDetectorRef, option: KbqTimezoneOption, overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality);
+    constructor(changeDetectorRef: ChangeDetectorRef, option: KbqTimezoneOption, overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, focusMonitor: FocusMonitor);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     onMouseEnter(): void;
     onMouseLeave(): void;
     private checkTooltipDisabled;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimezoneOptionTooltip, [null, null, null, null, null, null, null, null, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimezoneOptionTooltip, [null, null, null, null, null, null, null, null, { optional: true; }, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqTimezoneOptionTooltip, "kbq-timezone-option", never, {}, {}, never, never, false, never>;
 }

package/title/title.directive.d.ts

@@ -7,7 +7,6 @@ import { KbqTooltipTrigger } from '@koobiq/components/tooltip';
 import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
 export declare class KbqTitleDirective extends KbqTooltipTrigger implements AfterViewInit {
-    private focusMonitor;
     private componentInstance?;
     get isOverflown(): boolean;
     get viewValue(): string;

package/toast/_toast-theme.scss

@@ -22,16 +22,21 @@
 @mixin kbq-toast-theme($theme) {
     $toast: map.get(map.get($theme, components), toast);
 
-    $contrast: map.get($toast, contrast);
-    $error: map.get($toast, error);
-
     .kbq-toast {
         &.kbq-toast_contrast {
-            @include kbq-toast($contrast);
+            @include kbq-toast(map.get($toast, contrast));
+        }
+
+        &.kbq-toast_success {
+            @include kbq-toast(map.get($toast, success));
+        }
+
+        &.kbq-toast_warning {
+            @include kbq-toast(map.get($toast, success));
         }
 
         &.kbq-toast_error {
-            @include kbq-toast($error);
+            @include kbq-toast(map.get($toast, error));
         }
     }
 }

package/toast/toast-container.component.scss

@@ -12,5 +12,8 @@ $tokens: meta.module-variables(tokens) !default;
     flex-direction: column;
     align-items: flex-end;
 
-    gap: map.get($tokens, size-m);
+    margin-top: var(--kbq-toast-stack-size-margin-top, map.get($tokens, toast-stack-size-margin-top));
+    margin-right: var(--kbq-toast-stack-size-margin-right, map.get($tokens, toast-stack-size-margin-right));
+
+    gap: var(--kbq-toast-stack-size-gap, map.get($tokens, toast-stack-size-gap));
 }

package/toast/toast.component.scss

@@ -10,21 +10,27 @@ $tokens: meta.module-variables(tokens) !default;
     display: flex;
     box-sizing: border-box;
 
-    min-width: var(--kbq-toast-size-container-min-width, map.get($tokens, toast-size-container-min-width));
-    max-width: 480px;
+    width: var(--kbq-toast-size-container-width, map.get($tokens, toast-size-container-width));
 
     height: auto;
 
     border-radius: var(--kbq-toast-size-container-border-radius, map.get($tokens, toast-size-container-border-radius));
 
-    padding:
-        var(--kbq-toast-size-container-padding-vertical, map.get($tokens, toast-size-container-padding-vertical))
-        var(--kbq-toast-size-container-padding-horizontal, map.get($tokens, toast-size-container-padding-horizontal));
+    padding-left: var(--kbq-toast-size-container-padding-left, map.get($tokens, toast-size-container-padding-left));
+    padding-right: var(--kbq-toast-size-container-padding-right, map.get($tokens, toast-size-container-padding-right));
+}
 
-    gap: var(
-        --kbq-toast-size-container-content-gap-horizontal,
-        map.get($tokens, toast-size-container-content-gap-horizontal)
-    );
+.kbq-toast__icon-container {
+    width: var(--kbq-toast-size-icon-width, map.get($tokens, toast-size-icon-width));
+    max-width: var(--kbq-toast-size-icon-width, map.get($tokens, toast-size-icon-width));
+    height: var(--kbq-toast-size-icon-height, map.get($tokens, toast-size-icon-height));
+    max-height: var(--kbq-toast-size-icon-height, map.get($tokens, toast-size-icon-height));
+
+    border-radius: var(--kbq-toast-size-border-raius, map.get($tokens, toast-size-border-raius));
+
+    margin-right: var(--kbq-toast-size-icon-margin-right, map.get($tokens, toast-size-icon-margin-right));
+
+    padding-top: var(--kbq-toast-size-content-padding-top, map.get($tokens, toast-size-content-padding-top));
 }
 
 .kbq-toast__container {
@@ -33,10 +39,9 @@ $tokens: meta.module-variables(tokens) !default;
 
     flex: 1;
 
-    gap: var(
-        --kbq-toast-size-container-content-gap-vertical,
-        map.get($tokens, toast-size-container-content-gap-vertical)
-    )
+    padding-top: var(--kbq-toast-size-content-padding-top, map.get($tokens, toast-size-content-padding-top));
+    padding-right: map.get($tokens, size-s);
+    padding-bottom: var(--kbq-toast-size-content-padding-bottom, map.get($tokens, toast-size-content-padding-bottom));
 }
 
 .kbq-toast__title {
@@ -45,6 +50,10 @@ $tokens: meta.module-variables(tokens) !default;
     }
 }
 
+.kbq-toast__title_with-content {
+    padding-bottom: var(--kbq-toast-size-caption-padding-bottom, map.get($tokens, toast-size-caption-padding-bottom));
+}
+
 .kbq-toast__text {
     display: flex;
     flex: 1;
@@ -65,10 +74,6 @@ $tokens: meta.module-variables(tokens) !default;
         --kbq-toast-size-button-stack-content-gap-horizontal,
         map.get($tokens, toast-size-button-stack-content-gap-horizontal)
     );
-
-    & * + .kbq-link {
-        margin-left: 12px;
-    }
 }
 
 .kbq-toast__close-button {

package/toast/toast.type.d.ts

@@ -1,6 +1,8 @@
 import { TemplateRef, InjectionToken } from '@angular/core';
 export declare enum KbqToastStyle {
     Contrast = "contrast",
+    Success = "success",
+    Warning = "warning",
     Error = "error"
 }
 export declare enum KbqToastPosition {

package/tooltip/tooltip.component.d.ts

@@ -1,6 +1,7 @@
+import { FocusMonitor } from '@angular/cdk/a11y';
 import { Directionality } from '@angular/cdk/bidi';
 import { Overlay, ScrollDispatcher, ScrollStrategy, OverlayConfig } from '@angular/cdk/overlay';
-import { ChangeDetectorRef, ElementRef, EventEmitter, InjectionToken, NgZone, TemplateRef, Type, ViewContainerRef } from '@angular/core';
+import { ChangeDetectorRef, ElementRef, EventEmitter, InjectionToken, NgZone, OnDestroy, TemplateRef, Type, ViewContainerRef } from '@angular/core';
 import { KbqPopUp, KbqPopUpTrigger, PopUpPlacements, KbqComponentColors } from '@koobiq/components/core';
 import * as i0 from "@angular/core";
 export declare enum TooltipModifier {
@@ -37,7 +38,8 @@ export declare const KBQ_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER: {
     deps: (typeof Overlay)[];
     useFactory: typeof kbqTooltipScrollStrategyFactory;
 };
-export declare class KbqTooltipTrigger extends KbqPopUpTrigger<KbqTooltipComponent> {
+export declare class KbqTooltipTrigger extends KbqPopUpTrigger<KbqTooltipComponent> implements OnDestroy {
+    protected focusMonitor: FocusMonitor;
     get tooltipVisible(): boolean;
     set tooltipVisible(value: boolean);
     get tooltipPlacement(): PopUpPlacements;
@@ -64,20 +66,22 @@ export declare class KbqTooltipTrigger extends KbqPopUpTrigger<KbqTooltipCompone
     protected originSelector: string;
     protected overlayConfig: OverlayConfig;
     protected modifier: TooltipModifier;
-    constructor(overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality);
+    constructor(overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, focusMonitor: FocusMonitor);
+    ngOnDestroy(): void;
+    show(delay?: number): void;
     updateData(): void;
     closingActions(): import("rxjs").Observable<void | MouseEvent>;
     getOverlayHandleComponentType(): Type<KbqTooltipComponent>;
     updateClassMap(newPlacement?: string): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTooltipTrigger, [null, null, null, null, null, null, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTooltipTrigger, [null, null, null, null, null, null, { optional: true; }, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqTooltipTrigger, "[kbqTooltip]", ["kbqTooltip"], { "tooltipVisible": { "alias": "kbqVisible"; "required": false; }; "tooltipPlacement": { "alias": "kbqPlacement"; "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; }; "color": { "alias": "kbqTooltipColor"; "required": false; }; }, { "placementChange": "kbqPlacementChange"; "visibleChange": "kbqVisibleChange"; }, never, never, false, never>;
 }
 export declare class KbqWarningTooltipTrigger extends KbqTooltipTrigger {
     get content(): string | TemplateRef<any>;
     set content(content: string | TemplateRef<any>);
     protected modifier: TooltipModifier;
-    constructor(overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality);
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqWarningTooltipTrigger, [null, null, null, null, null, null, { optional: true; }]>;
+    constructor(overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, focusMonitor: FocusMonitor);
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqWarningTooltipTrigger, [null, null, null, null, null, null, { optional: true; }, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqWarningTooltipTrigger, "[kbqWarningTooltip]", ["kbqWarningTooltip"], { "content": { "alias": "kbqWarningTooltip"; "required": false; }; }, {}, never, never, false, never>;
 }
 export declare class KbqExtendedTooltipTrigger extends KbqTooltipTrigger {
@@ -87,8 +91,8 @@ export declare class KbqExtendedTooltipTrigger extends KbqTooltipTrigger {
     set header(header: string | TemplateRef<any>);
     private _header;
     protected modifier: TooltipModifier;
-    constructor(overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality);
+    constructor(overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, focusMonitor: FocusMonitor);
     updateData(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KbqExtendedTooltipTrigger, [null, null, null, null, null, null, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqExtendedTooltipTrigger, [null, null, null, null, null, null, { optional: true; }, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqExtendedTooltipTrigger, "[kbqExtendedTooltip]", ["kbqExtendedTooltip"], { "content": { "alias": "kbqExtendedTooltip"; "required": false; }; "header": { "alias": "kbqTooltipHeader"; "required": false; }; }, {}, never, never, false, never>;
 }