@koobiq/components 19.2.0 → 19.3.0

package/skeleton/skeleton.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+/**
+ * Component representing a skeleton placeholder.
+ */
+export declare class KbqSkeleton {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqSkeleton, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqSkeleton, "kbq-skeleton", ["kbqSkeleton"], {}, {}, never, never, true, never>;
+}

package/skeleton/skeleton.scss

@@ -0,0 +1,41 @@
+@keyframes wave {
+    from {
+        transform: translateX(calc(var(--kbq-skeleton-wave-width) * -1));
+    }
+
+    to {
+        transform: translateX(100vw);
+    }
+}
+
+.kbq-skeleton {
+    --kbq-skeleton-min-height: var(--kbq-size-l);
+    --kbq-skeleton-animation-duration: 1.2s;
+    --kbq-skeleton-border-radius: var(--kbq-size-xxs);
+    --kbq-skeleton-wave-width: 100px;
+
+    position: relative;
+    display: flex;
+    min-height: var(--kbq-skeleton-min-height);
+    border-radius: var(--kbq-skeleton-border-radius);
+    background-color: var(--kbq-skeleton-background);
+    overflow: hidden;
+    clip-path: inset(0);
+    user-select: none;
+    pointer-events: none;
+
+    &::after {
+        content: '';
+        position: fixed;
+        inset-block: 0;
+        left: calc(var(--kbq-skeleton-wave-width) * -1);
+        width: var(--kbq-skeleton-wave-width);
+        background: linear-gradient(
+            90deg,
+            var(--kbq-skeleton-animation-wave-start) 0%,
+            var(--kbq-skeleton-animation-wave-center) 50%,
+            var(--kbq-skeleton-animation-wave-end) 100%
+        );
+        animation: wave var(--kbq-skeleton-animation-duration) ease-in infinite;
+    }
+}

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

@@ -40,7 +40,8 @@ export declare class KbqTreeNavigationChange<T> {
 export declare class KbqTreeSelectionChange<T> {
     source: KbqTreeSelection;
     option: T;
-    constructor(source: KbqTreeSelection, option: T);
+    options?: T[] | undefined;
+    constructor(source: KbqTreeSelection, option: T, options?: T[] | undefined);
 }
 interface SelectionModelOption {
     id: number | string;

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

@@ -64,7 +64,8 @@ export declare class KbqTreeSelectChange {
     source: KbqTreeSelect;
     value: any;
     isUserInput: boolean;
-    constructor(source: KbqTreeSelect, value: any, isUserInput?: boolean);
+    values?: unknown[] | undefined;
+    constructor(source: KbqTreeSelect, value: any, isUserInput?: boolean, values?: unknown[] | undefined);
 }
 export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterContentInit, AfterViewInit, OnDestroy, OnInit, DoCheck, ControlValueAccessor, KbqFormFieldControl<KbqTreeOption>, CanUpdateErrorState {
     elementRef: ElementRef<HTMLElement>;