@indigina/ui-kit 1.1.108 → 1.1.110

package/lib/components/kit-dialog/kit-dialog.component.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from "@angular/core";
 export declare class KitDialogComponent {
     static ɵfac: i0.ɵɵFactoryDeclaration<KitDialogComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KitDialogComponent, "kit-dialog", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KitDialogComponent, "kit-dialog", never, {}, {}, never, never, true, never>;
 }

package/lib/components/kit-dialog/kit-dialog.service.d.ts

@@ -1,17 +1,13 @@
-import { EventEmitter, Type } from '@angular/core';
-import { DialogRef, DialogService } from '@progress/kendo-angular-dialog';
+import { DialogRef, DialogService, DialogSettings } from '@progress/kendo-angular-dialog';
 import * as i0 from "@angular/core";
-export interface KitDialog<C> {
-    title: string;
-    component: Type<C>;
-}
 export declare class KitDialogService {
-    private dialogService;
-    opened: EventEmitter<DialogRef>;
-    closed: EventEmitter<DialogRef>;
-    dialogRef: DialogRef | null;
+    private readonly dialogService;
+    private readonly _dialogRef;
+    get isDialogOpen(): boolean;
+    get dialogInstance(): DialogRef['content']['instance'] | null;
+    get dialogRef(): DialogRef | null;
     constructor(dialogService: DialogService);
-    openDialog<C>(dialog: KitDialog<C>): void;
+    openDialog(settings: DialogSettings): void;
     closeDialog(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<KitDialogService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<KitDialogService>;

package/lib/components/kit-dialog-actions/kit-dialog-actions.component.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from "@angular/core";
 export declare class KitDialogActionsComponent {
     static ɵfac: i0.ɵɵFactoryDeclaration<KitDialogActionsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KitDialogActionsComponent, "kit-dialog-actions", never, {}, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KitDialogActionsComponent, "kit-dialog-actions", never, {}, {}, never, ["*"], true, never>;
 }

package/lib/components/kit-popup/kit-popup.component.d.ts

@@ -1,43 +1,40 @@
-import { ElementRef, EventEmitter, OnInit, WritableSignal } from '@angular/core';
-import { KitPopupAlign, KitPopupAlignHorizontal, KitPopupPositionMode } from './kit-popup.model';
+import { ElementRef, InputSignal, OutputEmitterRef, TemplateRef } from '@angular/core';
+import { PopupSettings, PopupService } from '@progress/kendo-angular-popup';
 import { KitButtonKind, KitButtonType } from '../kit-button/kit-button.const';
+import { KitPopupPositionMode } from './kit-popup.model';
 import * as i0 from "@angular/core";
-export declare class KitPopupComponent implements OnInit {
-    private elementRef;
-    /**
-     * Specifies the element that will be used as an anchor. The Popup opens next to that element
-     */
-    anchor?: ElementRef | HTMLElement | null;
-    /**
-     * Defines whether to close popup when the user clicks outside its boundaries
-     */
-    closeOnOutsideClick: boolean;
-    /**
-     * Defines the horizontal position of the anchor element
-     */
-    anchorHorizontalAlign: KitPopupAlignHorizontal;
-    /**
-     * Defines the horizontal position of the popup
-     */
-    popupHorizontalAlign: KitPopupAlignHorizontal;
-    showFooter: boolean;
-    cancelButtonLabel: string;
-    applyButtonLabel: string;
-    isApplyButtonDisabled: boolean;
-    positionMode: KitPopupPositionMode;
-    cancel: EventEmitter<void>;
-    apply: EventEmitter<void>;
-    readonly visible: WritableSignal<boolean>;
-    readonly anchorAlign: KitPopupAlign;
-    readonly popupAlign: KitPopupAlign;
+export declare class KitPopupComponent {
+    private readonly popupService;
+    popupTemplate: TemplateRef<unknown>;
+    readonly anchor: InputSignal<ElementRef | HTMLElement>;
+    readonly content: InputSignal<TemplateRef<unknown>>;
+    readonly closeOnOutsideClick: InputSignal<boolean>;
+    readonly showFooter: InputSignal<boolean>;
+    readonly cancelButtonLabel: InputSignal<string>;
+    readonly applyButtonLabel: InputSignal<string>;
+    readonly isApplyButtonDisabled: InputSignal<boolean>;
+    readonly positionMode: InputSignal<KitPopupPositionMode>;
+    readonly popupClass: InputSignal<string>;
+    readonly closePopupOnCancel: InputSignal<boolean>;
+    readonly onCancel: OutputEmitterRef<void>;
+    readonly onApply: OutputEmitterRef<void>;
+    readonly onOpen: OutputEmitterRef<void>;
+    readonly onClose: OutputEmitterRef<void>;
     readonly kitButtonKind: typeof KitButtonKind;
     readonly kitButtonType: typeof KitButtonType;
-    constructor(elementRef: ElementRef);
+    private popupRef;
+    private readonly destroy$;
+    get popupHTMLElement(): HTMLElement | null;
+    get isPopupOpen(): boolean;
+    get anchorElement(): HTMLElement;
+    constructor(popupService: PopupService);
     documentClick(event: Event): void;
     ngOnInit(): void;
-    get anchorElement(): HTMLElement;
-    toggle(): void;
-    hide(): void;
+    ngOnDestroy(): void;
+    toggle(options?: PopupSettings): void;
+    close(): void;
+    cancel(): void;
+    apply(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<KitPopupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KitPopupComponent, "kit-popup", never, { "anchor": { "alias": "anchor"; "required": false; }; "closeOnOutsideClick": { "alias": "closeOnOutsideClick"; "required": false; }; "anchorHorizontalAlign": { "alias": "anchorHorizontalAlign"; "required": false; }; "popupHorizontalAlign": { "alias": "popupHorizontalAlign"; "required": false; }; "showFooter": { "alias": "showFooter"; "required": false; }; "cancelButtonLabel": { "alias": "cancelButtonLabel"; "required": false; }; "applyButtonLabel": { "alias": "applyButtonLabel"; "required": false; }; "isApplyButtonDisabled": { "alias": "isApplyButtonDisabled"; "required": false; }; "positionMode": { "alias": "positionMode"; "required": false; }; }, { "cancel": "cancel"; "apply": "apply"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KitPopupComponent, "kit-popup", never, { "anchor": { "alias": "anchor"; "required": true; "isSignal": true; }; "content": { "alias": "content"; "required": true; "isSignal": true; }; "closeOnOutsideClick": { "alias": "closeOnOutsideClick"; "required": false; "isSignal": true; }; "showFooter": { "alias": "showFooter"; "required": false; "isSignal": true; }; "cancelButtonLabel": { "alias": "cancelButtonLabel"; "required": false; "isSignal": true; }; "applyButtonLabel": { "alias": "applyButtonLabel"; "required": false; "isSignal": true; }; "isApplyButtonDisabled": { "alias": "isApplyButtonDisabled"; "required": false; "isSignal": true; }; "positionMode": { "alias": "positionMode"; "required": false; "isSignal": true; }; "popupClass": { "alias": "popupClass"; "required": false; "isSignal": true; }; "closePopupOnCancel": { "alias": "closePopupOnCancel"; "required": false; "isSignal": true; }; }, { "onCancel": "onCancel"; "onApply": "onApply"; "onOpen": "onOpen"; "onClose": "onClose"; }, never, never, true, never>;
 }

package/lib/components/kit-profile-menu/kit-profile-menu.component.d.ts

@@ -21,12 +21,13 @@ export declare class KitProfileMenuComponent {
      * Defines the image source of the avatar
      */
     avatarImageSrc?: string;
-    userMenu: KitPopupComponent;
+    popup: KitPopupComponent;
     readonly KitAvatarSize: typeof KitAvatarSize;
     readonly KitSvgIcon: typeof KitSvgIcon;
     readonly KitPopupAlignHorizontal: typeof KitPopupAlignHorizontal;
     readonly KitSvgIconType: typeof KitSvgIconType;
     onClick(item: KitProfileMenuItem): void;
+    toggle(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<KitProfileMenuComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<KitProfileMenuComponent, "kit-profile-menu", never, { "menuItems": { "alias": "menuItems"; "required": false; }; "userName": { "alias": "userName"; "required": false; }; "companyName": { "alias": "companyName"; "required": false; }; "avatarImageSrc": { "alias": "avatarImageSrc"; "required": false; }; }, {}, never, never, true, never>;
 }

package/package.json

@@ -7,7 +7,7 @@
     "components",
     "shared"
   ],
-  "version": "1.1.108",
+  "version": "1.1.110",
   "peerDependencies": {
     "@angular/common": "^19.1.4",
     "@angular/core": "^19.1.4"

package/public-api.d.ts

@@ -77,10 +77,9 @@ export { KitNavigationTabsModule } from './lib/components/kit-navigation-tabs/ki
 export { KitNavigationTabsItem, KitNavigationTabsItemLink } from './lib/components/kit-navigation-tabs/kit-navigation-tabs.model';
 export { KitNavigationTabsType } from './lib/components/kit-navigation-tabs/kit-navigation-tabs.const';
 export { KitDialogComponent } from './lib/components/kit-dialog/kit-dialog.component';
-export { KitDialogModule } from './lib/components/kit-dialog/kit-dialog.module';
-export { KitDialog, KitDialogService } from './lib/components/kit-dialog/kit-dialog.service';
+export { KitDialogService } from './lib/components/kit-dialog/kit-dialog.service';
 export { KitDialogActionsComponent } from './lib/components/kit-dialog-actions/kit-dialog-actions.component';
-export { KitDialogActionsModule } from './lib/components/kit-dialog-actions/kit-dialog-actions.module';
+export { DialogRef, DialogContentBase, DialogAction, DialogCloseResult, DialogResult } from '@progress/kendo-angular-dialog';
 export { KitTimepickerComponent } from './lib/components/kit-timepicker/kit-timepicker.component';
 export { KitTimepickerModule } from './lib/components/kit-timepicker/kit-timepicker.module';
 export { KitSkeletonComponent, KitSkeletonShape, KitSkeletonAnimation } from './lib/components/kit-skeleton/kit-skeleton.component';

package/styles/components/button-variants.scss

@@ -0,0 +1,255 @@
+@mixin setIconColor($color) {
+  &.fill {
+    fill: $color;
+    stroke: none;
+  }
+
+  &.stroke {
+    stroke: $color;
+    fill: none;
+  }
+}
+
+@mixin styles {
+  .k-button-text {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+
+  .kit-button-icon {
+    display: block;
+  }
+
+  .k-button {
+    font-weight: 400;
+    border: 1px solid transparent;
+    transition: none;
+
+    &:focus {
+      box-shadow: none;
+    }
+
+    &:disabled {
+      color: var(--ui-kit-color-grey-12);
+      border: 1px solid var(--ui-kit-color-grey-11);
+      background: var(--ui-kit-color-grey-13);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-grey-12));
+      }
+    }
+  }
+
+  .primary {
+    color: var(--ui-kit-color-white);
+    background: var(--ui-kit-color-main);
+
+    &:hover {
+      background: var(--ui-kit-color-hover);
+    }
+
+    &.active,
+    &:active {
+      background: var(--ui-kit-color-main);
+    }
+
+    .kit-button-icon {
+      @include setIconColor(var(--ui-kit-color-white));
+    }
+  }
+
+  .ghost {
+    color: var(--ui-kit-color-grey-10);
+    border-color: var(--ui-kit-color-grey-11);
+    background: var(--ui-kit-color-white);
+
+    &:hover {
+      color: var(--ui-kit-color-hover);
+      border-color: var(--ui-kit-color-hover);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-hover));
+      }
+    }
+
+    &.active,
+    &:active {
+      color: var(--ui-kit-color-main);
+      border-color: var(--ui-kit-color-main);
+      background: var(--ui-kit-color-background);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-main));
+      }
+    }
+
+    .kit-button-icon {
+      @include setIconColor(var(--ui-kit-color-grey-10));
+    }
+  }
+
+  .text {
+    color: var(--ui-kit-color-grey-10);
+    background: none;
+
+    &:disabled {
+      border: none;
+      background: none;
+    }
+
+    &:hover,
+    &.active,
+    &:active {
+      background: var(--ui-kit-color-grey-13);
+    }
+
+    &:hover {
+      color: var(--ui-kit-color-hover);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-hover));
+      }
+    }
+
+    &.active,
+    &:active {
+      color: var(--ui-kit-color-main);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-main));
+      }
+    }
+
+    .kit-button-icon {
+      @include setIconColor(var(--ui-kit-color-grey-10));
+    }
+  }
+
+  .link {
+    color: var(--ui-kit-color-main);
+    background: none;
+
+    &:disabled {
+      border: none;
+      background: none;
+    }
+
+    &:hover {
+      color: var(--ui-kit-color-hover);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-hover));
+      }
+    }
+
+    &.active,
+    &:active {
+      color: var(--ui-kit-color-main);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-main));
+      }
+    }
+
+    .kit-button-icon {
+      @include setIconColor(var(--ui-kit-color-main));
+    }
+  }
+
+  .dashed {
+    color: var(--ui-kit-color-main);
+    border-color: var(--ui-kit-color-main);
+    border-style: dashed;
+    background: var(--ui-kit-color-white);
+
+    &:disabled {
+      border-style: dashed;
+    }
+
+    &:hover {
+      color: var(--ui-kit-color-hover);
+      border-color: var(--ui-kit-color-hover);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-hover));
+      }
+    }
+
+    &.active,
+    &:active {
+      color: var(--ui-kit-color-main);
+      border-color: var(--ui-kit-color-main);
+
+      .kit-button-icon {
+        @include setIconColor(var(--ui-kit-color-main));
+      }
+    }
+
+    .kit-button-icon {
+      @include setIconColor(var(--ui-kit-color-main));
+    }
+  }
+
+  .large {
+    padding: 0 16px;
+    height: 40px;
+    font-size: 16px;
+    border-radius: 8px;
+
+    .kit-button-icon {
+      width: 18px;
+      height: 18px;
+    }
+  }
+
+  .medium {
+    padding: 0 16px;
+    height: 32px;
+    font-size: 14px;
+    border-radius: 6px;
+
+    .kit-button-icon {
+      width: 16px;
+      height: 16px;
+    }
+  }
+
+  .small {
+    padding: 0 8px;
+    height: 24px;
+    font-size: 14px;
+    border-radius: 4px;
+
+    .kit-button-icon {
+      width: 14px;
+      height: 14px;
+    }
+  }
+
+  .leading {
+    .k-button-text {
+      flex-direction: row-reverse;
+    }
+  }
+
+  .trailing {
+    .k-button-text {
+      flex-direction: row;
+    }
+  }
+
+  .no-label {
+    &.large {
+      padding: 0 11px;
+    }
+
+    &.medium {
+      padding: 0 8px;
+    }
+
+    &.small {
+      padding: 0 6px;
+    }
+  }
+}

package/lib/components/kit-dialog/kit-dialog.module.d.ts

@@ -1,9 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./kit-dialog.component";
-import * as i2 from "@progress/kendo-angular-dialog";
-import * as i3 from "@progress/kendo-angular-buttons";
-export declare class KitDialogModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<KitDialogModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<KitDialogModule, [typeof i1.KitDialogComponent], [typeof i2.DialogModule, typeof i3.ButtonModule], [typeof i1.KitDialogComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<KitDialogModule>;
-}

package/lib/components/kit-dialog-actions/kit-dialog-actions.module.d.ts

@@ -1,8 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./kit-dialog-actions.component";
-import * as i2 from "@progress/kendo-angular-dialog";
-export declare class KitDialogActionsModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<KitDialogActionsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<KitDialogActionsModule, [typeof i1.KitDialogActionsComponent], [typeof i2.WindowModule], [typeof i1.KitDialogActionsComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<KitDialogActionsModule>;
-}