@koobiq/components 17.0.0-rc.1 → 17.0.0-rc.3

package/schematics/collection.json

@@ -0,0 +1,11 @@
+{
+    "$schema": "../../../node_modules/@angular-devkit/schematics/collection-schema.json",
+    "schematics": {
+        "ng-add": {
+            "description": "Adds @koobiq/components library to the project and installs dependencies",
+            "factory": "./ng-add/index",
+            "schema": "./ng-add/schema.json",
+            "aliases": ["install"]
+        }
+    }
+}

package/schematics/ng-add/index.js

@@ -0,0 +1,70 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var schematics = require('@angular-devkit/schematics');
+var utility = require('@schematics/angular/utility');
+
+/**
+ * Sorts the keys of the given object.
+ * @returns A new object instance with sorted keys
+ */
+function sortObjectByKeys(obj) {
+    return Object.keys(obj)
+        .sort()
+        .reduce((result, key) => (result[key] = obj[key]) && result, {});
+}
+/**
+ * Adds a package to the package.json in the given tree
+ */
+function addPackageToPackageJson(tree, pkg, version, devDependency = false) {
+    if (tree.exists('package.json')) {
+        const sourceText = tree.read('package.json').toString('utf-8');
+        const json = JSON.parse(sourceText);
+        const dependenciesType = devDependency ? 'devDependencies' : 'dependencies';
+        const dependencies = json[dependenciesType] || {};
+        if (!dependencies[pkg]) {
+            dependencies[pkg] = version;
+            json[dependenciesType] = sortObjectByKeys(dependencies);
+        }
+        tree.overwrite('package.json', JSON.stringify(json, null, 2));
+    }
+    return tree;
+}
+
+function noProject(project) {
+    return `Unable to find project '${project}' in the workspace`;
+}
+
+/**
+ * This is executed when `ng add @koobiq/components` is run.
+ * It installs all dependencies in the 'package.json' and runs 'ng-add-setup-project' schematic.
+ */
+function ngAdd(options) {
+    return async (tree) => {
+        const { project } = options;
+        if (project) {
+            const workspace = await utility.readWorkspace(tree);
+            const projectWorkspace = workspace.projects.get(project);
+            if (!projectWorkspace) {
+                throw new schematics.SchematicsException(noProject(project));
+            }
+        }
+        // Installing dependencies
+        addPackageToPackageJson(tree, '@angular/cdk', "^17.2.0");
+        addPackageToPackageJson(tree, '@koobiq/cdk', "^17.0.0-rc.3");
+        addPackageToPackageJson(tree, '@koobiq/angular-luxon-adapter', "^17.0.0-rc.3");
+        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-rc.2");
+        addPackageToPackageJson(tree, '@koobiq/design-tokens', "^3.0.0-rc.2");
+        addPackageToPackageJson(tree, '@messageformat/core', "^3.0.1");
+        addPackageToPackageJson(tree, 'luxon', "^3.4.4");
+        addPackageToPackageJson(tree, 'marked', "^4.0.18");
+        addPackageToPackageJson(tree, 'overlayscrollbars', "^2.7.3");
+        addPackageToPackageJson(tree, 'ngx-highlightjs', "^10.0.0");
+    };
+}
+
+exports.default = ngAdd;

package/schematics/ng-add/schema.json

@@ -0,0 +1,15 @@
+{
+    "$schema": "http://json-schema.org/schema",
+    "$id": "koobiq-components-ng-add",
+    "title": "koobiq-components ng-add schematic",
+    "type": "object",
+    "properties": {
+        "project": {
+            "type": "string",
+            "description": "Name of the project",
+            "$default": {
+                "$source": "projectName"
+            }
+        }
+    }
+}

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/select/select.component.d.ts

@@ -189,6 +189,8 @@ export declare class KbqSelect extends KbqSelectMixinBase implements AfterConten
     get triggerValue(): string;
     get triggerValues(): KbqOptionBase[];
     get empty(): boolean;
+    get firstSelected(): KbqOptionBase | null;
+    get firstFiltered(): boolean;
     private closeSubscription;
     /** The scroll position of the overlay panel, calculated to center the selected option. */
     private scrollTop;

package/splitter/_splitter-theme.scss

@@ -11,7 +11,7 @@
 
         &:hover,
         &.kbq-gutter_dragged {
-            background-color: map.get($background, ghost-hover);
+            background-color: rgba(106, 115, 150, 0.08);
         }
 
         &.kbq-gutter_vertical {
@@ -27,6 +27,6 @@
     }
 
     .kbq-gutter-ghost {
-        background: kbq-color($background, ghost-active);
+        background: rgba(106, 115, 150, 0.16);
     }
 }

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/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>;
 }

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

@@ -228,6 +228,7 @@ export declare class KbqTreeSelect extends KbqTreeSelectMixinBase implements Aft
     get triggerValue(): string;
     get empty(): boolean;
     isRtl(): boolean;
+    get firstSelected(): any;
     handleKeydown(event: KeyboardEvent): void;
     onFocus(): void;
     /**