@koobiq/components 16.0.0-beta.7 → 16.0.0-beta.9

package/sidepanel/_sidepanel-theme.scss

@@ -7,8 +7,13 @@
 @mixin kbq-sidepanel-theme($theme) {
     $sidepanel: map.get(map.get($theme, components), sidepanel);
 
+    .kbq-sidepanel-title {
+        color: map.get($sidepanel, header-text);
+    }
+
     .kbq-sidepanel-content {
         background-color: map.get($sidepanel, background);
+        color: map.get($sidepanel, content-text);
     }
 
     .kbq-sidepanel-container_shadowed {

package/table/_table-theme.scss

@@ -25,7 +25,7 @@
 
                 & > th,
                 & > td {
-                    color: map.get($foreground, text);
+                    color: map.get($foreground, contrast);
                 }
             }
         }

package/toast/toast-animations.d.ts

@@ -2,3 +2,4 @@ import { AnimationTriggerMetadata } from '@angular/animations';
 export declare const mcToastAnimations: {
     readonly toastState: AnimationTriggerMetadata;
 };
+export declare const toastState: AnimationTriggerMetadata;

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

@@ -1,15 +1,19 @@
-import { ChangeDetectorRef, ComponentRef, EmbeddedViewRef, Injector, TemplateRef, ViewContainerRef, ViewRef } from '@angular/core';
+import { CdkScrollable, ScrollDispatcher } from '@angular/cdk/overlay';
+import { ChangeDetectorRef, ComponentRef, ElementRef, EmbeddedViewRef, Injector, NgZone, TemplateRef, ViewContainerRef, ViewRef } from '@angular/core';
+import { KbqToastService } from './toast.service';
 import { KbqToastData } from './toast.type';
 import * as i0 from "@angular/core";
-export declare class KbqToastContainerComponent {
+export declare class KbqToastContainerComponent extends CdkScrollable {
     private injector;
     private changeDetectorRef;
+    readonly service: KbqToastService;
     viewContainer: ViewContainerRef;
-    constructor(injector: Injector, changeDetectorRef: ChangeDetectorRef);
+    constructor(injector: Injector, changeDetectorRef: ChangeDetectorRef, service: KbqToastService, elementRef: ElementRef<HTMLElement>, scrollDispatcher: ScrollDispatcher, ngZone: NgZone);
     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;
+    dispatchScrollEvent: () => void;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqToastContainerComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<KbqToastContainerComponent, "kbq-toast-container", never, {}, {}, never, never, false, never>;
 }

package/toast/toast.component.d.ts

@@ -1,3 +1,4 @@
+import { AnimationEvent } from '@angular/animations';
 import { FocusMonitor } from '@angular/cdk/a11y';
 import { ElementRef, OnDestroy } from '@angular/core';
 import { ThemePalette } from '@koobiq/components/core';
@@ -31,6 +32,7 @@ export declare class KbqToastComponent implements OnDestroy {
     ngOnDestroy(): void;
     close(): void;
     isTemplateRef(value: any): boolean;
+    onAnimation($event: AnimationEvent): void;
     private runFocusMonitor;
     private stopFocusMonitor;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqToastComponent, never>;

package/toast/toast.service.d.ts

@@ -1,3 +1,4 @@
+import { AnimationEvent } from '@angular/animations';
 import { Overlay } from '@angular/cdk/overlay';
 import { Injector, ComponentRef, TemplateRef, EmbeddedViewRef, InjectionToken } from '@angular/core';
 import { BehaviorSubject } from 'rxjs';
@@ -15,6 +16,7 @@ export declare class KbqToastService<T extends KbqToastComponent = KbqToastCompo
     get templates(): EmbeddedViewRef<T>[];
     readonly hovered: BehaviorSubject<boolean>;
     readonly focused: BehaviorSubject<boolean>;
+    readonly animation: BehaviorSubject<AnimationEvent | null>;
     private containerInstance;
     private overlayRef;
     private portal;

package/toggle/_toggle-theme.scss

@@ -67,7 +67,7 @@
     $toggle-error: map.get($toggle, error);
 
     .kbq-toggle {
-        color: map.get($foreground, text);
+        color: map.get($foreground, contrast);
 
         @include kbq-toggle-color($toggle-theme);
 
@@ -86,6 +86,10 @@
         & .kbq-hint {
             @include kbq-typography-level-to-styles($config, map.get($tokens, toggle-font-normal-caption));
         }
+
+        & .kbq-toggle-bar-container {
+            height: kbq-line-height($config, map.get($tokens, toggle-font-normal-label));
+        }
     }
 
     .kbq-toggle.kbq-toggle_big {
@@ -94,5 +98,9 @@
         & .kbq-hint {
             @include kbq-typography-level-to-styles($config, map.get($tokens, toggle-font-big-caption));
         }
+
+        & .kbq-toggle-bar-container {
+            height: kbq-line-height($config, map.get($tokens, toggle-font-big-label));
+        }
     }
 }

package/toggle/toggle.scss

@@ -32,6 +32,11 @@ $tokens: meta.module-variables(tokens) !default;
         }
     }
 
+    .kbq-toggle-bar-container {
+        display: flex;
+        align-items: center;
+    }
+
     .kbq-toggle-bar {
         position: relative;
         box-sizing: border-box;
@@ -80,8 +85,6 @@ $tokens: meta.module-variables(tokens) !default;
 
 .kbq-toggle.kbq-toggle_big {
     & .kbq-toggle-bar {
-        margin-top: 2px;
-
         height: var(--kbq-toggle-size-big-height, map.get($tokens, toggle-size-big-height));
         width: var(--kbq-toggle-size-big-width, map.get($tokens, toggle-size-big-width));
     }

package/tooltip/tooltip.component.d.ts

@@ -70,7 +70,7 @@ export declare class KbqTooltipTrigger extends KbqPopUpTrigger<KbqTooltipCompone
     getOverlayHandleComponentType(): Type<KbqTooltipComponent>;
     updateClassMap(newPlacement?: string): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTooltipTrigger, [null, null, null, null, null, null, { optional: true; }]>;
-    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": "mcEnterDelay"; "required": false; }; "leaveDelay": { "alias": "mcLeaveDelay"; "required": false; }; "trigger": { "alias": "kbqTrigger"; "required": false; }; "customClass": { "alias": "kbqTooltipClass"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, { "placementChange": "kbqPlacementChange"; "visibleChange": "kbqVisibleChange"; }, never, never, false, never>;
+    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": "mcEnterDelay"; "required": false; }; "leaveDelay": { "alias": "mcLeaveDelay"; "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>;

package/tree/_tree-theme.scss

@@ -40,7 +40,7 @@
 
         @include kbq-tree-option(map.get($tree-item, default));
 
-        &:hover:not(.kbq-disabled):not([disabled]) {
+        &:hover:not(.kbq-disabled) {
             @include kbq-tree-option(map.get($tree-item, hover));
         }
 
@@ -52,7 +52,7 @@
         &.kbq-selected {
             @include kbq-tree-option(map.get($tree-item, selected));
 
-            &:hover:not(.kbq-disabled):not([disabled]) {
+            &:hover:not(.kbq-disabled) {
                 @include kbq-tree-option(map.get($tree-item, selected-hover));
             }
         }

package/tree/control/base-tree-control.d.ts

@@ -7,7 +7,7 @@ export declare abstract class BaseTreeControl<T> implements TreeControl<T> {
     /** A selection model with multi-selection to track expansion status. */
     expansionModel: SelectionModel<T>;
     filterModel: SelectionModel<T>;
-    filterValue: BehaviorSubject<string>;
+    filterValue: BehaviorSubject<string | null>;
     /** Get depth of a given data node, return the level number. This is for flat tree node. */
     getLevel: (dataNode: T) => number;
     /**

package/tree/control/tree-control.d.ts

@@ -11,7 +11,7 @@ export interface TreeControl<T> {
     /** The expansion model */
     expansionModel: SelectionModel<T>;
     filterModel: SelectionModel<T>;
-    filterValue: BehaviorSubject<string>;
+    filterValue: BehaviorSubject<string | null>;
     /** Get depth of a given data node, return the level number. This is for flat tree node. */
     getLevel(dataNode: T): number;
     /**

package/tree-select/_tree-select-theme.scss

@@ -10,8 +10,11 @@
     $foreground: map.get($theme, foreground);
     $error: map.get($theme, error);
 
+    $select-panel: map.get(map.get($theme, components), select-panel);
+    $divider: map.get(map.get($theme, components), divider);
+
     .kbq-tree-select {
-        color: map.get($foreground, text);
+        color: map.get($foreground, contrast);
 
         &.ng-invalid {
             color: kbq-color($error);
@@ -29,12 +32,11 @@
     }
 
     .kbq-tree-select__panel {
-        @include popup-params($theme);
+        box-shadow: map.get($select-panel, shadow);
+        background: map.get($select-panel, background);
 
         & .kbq-tree-select__footer {
-            $popup: map.get(map.get($theme, components), popup);
-
-            border-color: map.get($popup, border);
+            border-color: map.get($divider, color);
         }
     }
 }

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

@@ -28,7 +28,7 @@ export declare class KbqTreeSelectTrigger {
 }
 export declare class KbqTreeSelectFooter {
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTreeSelectFooter, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqTreeSelectFooter, "kbq-tree-select-footer, [kbq-tree-select-footer], [kbq-tree-selection-footer]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqTreeSelectFooter, "kbq-tree-select-footer, [kbq-tree-select-footer]", never, {}, {}, never, never, false, never>;
 }
 /** @docs-private */
 declare class KbqTreeSelectBase {
@@ -280,6 +280,6 @@ export declare class KbqTreeSelect extends KbqTreeSelectMixinBase implements Aft
     private _compareWith;
     private subscribeOnSearchChanges;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTreeSelect, [null, null, null, null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; self: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTreeSelect, "kbq-tree-select", ["kbqTreeSelect"], { "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "hiddenItemsText": { "alias": "hiddenItemsText"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "backdropClass": { "alias": "backdropClass"; "required": false; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; }; "sortComparator": { "alias": "sortComparator"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "autoSelect": { "alias": "autoSelect"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "id": { "alias": "id"; "required": false; }; "hasBackdrop": { "alias": "hasBackdrop"; "required": false; }; "hiddenItemsTextFormatter": { "alias": "hiddenItemsTextFormatter"; "required": false; }; }, { "openedChange": "openedChange"; "openedStream": "opened"; "closedStream": "closed"; "selectionChange": "selectionChange"; "valueChange": "valueChange"; }, ["cleaner", "customTrigger", "customMatcher", "customTagTemplateRef", "tree", "search"], ["kbq-tree-select-trigger", "kbq-cleaner", "[kbqSelectSearch]", "[kbq-select-search-empty-result]", "kbq-tree-selection", "kbq-tree-select-footer,[kbq-tree-select-footer],[kbq-tree-selection-footer]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTreeSelect, "kbq-tree-select", ["kbqTreeSelect"], { "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "hiddenItemsText": { "alias": "hiddenItemsText"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "backdropClass": { "alias": "backdropClass"; "required": false; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; }; "sortComparator": { "alias": "sortComparator"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "autoSelect": { "alias": "autoSelect"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "id": { "alias": "id"; "required": false; }; "hasBackdrop": { "alias": "hasBackdrop"; "required": false; }; "hiddenItemsTextFormatter": { "alias": "hiddenItemsTextFormatter"; "required": false; }; }, { "openedChange": "openedChange"; "openedStream": "opened"; "closedStream": "closed"; "selectionChange": "selectionChange"; "valueChange": "valueChange"; }, ["cleaner", "customTrigger", "customMatcher", "customTagTemplateRef", "tree", "search"], ["kbq-tree-select-trigger", "kbq-cleaner", "[kbqSelectSearch]", "[kbq-select-search-empty-result]", "kbq-tree-selection", "kbq-tree-select-footer,[kbq-tree-select-footer]"], false, never>;
 }
 export {};