@rlucan/ui 14.2.4 → 14.2.5

package/lib/action-button/action-button.component.d.ts

@@ -17,7 +17,6 @@ export declare class ActionButtonComponent extends ButtonComponent implements On
     private leftPositions;
     openOverlay: boolean;
     onKeydownHandler(evt: KeyboardEvent): void;
-    constructor();
     get positions(): {
         originX: string;
         originY: string;

package/lib/date/date.component.d.ts

@@ -8,6 +8,7 @@ export declare class DateComponent extends UiSimpleComponent {
     picker?: TemplateRef<any>;
     input?: TemplateRef<any>;
     onChange: any;
+    hasFocus: boolean;
     controlTypeName: string;
     opening: boolean;
     constructor(ngControl: NgControl);

package/lib/file/file.component.d.ts

@@ -13,11 +13,17 @@ export declare class FileComponent implements OnInit, OnChanges {
         src: string;
         mimeType?: string;
     };
+    get fitImageFileSize(): boolean;
     visible: boolean;
     src: any;
     srcUrlMimeType: any;
+    nativeFileSizeRatio: number;
+    nativeFileWidth: any;
+    nativeFileHeight: any;
     get width(): string;
+    get maxWidth(): string;
     get height(): string;
+    get maxHeight(): string;
     get isVideo(): any;
     get mime(): any;
     get useRetinaSrc(): boolean;

package/lib/input/input.component.d.ts

@@ -2,18 +2,29 @@ import { ElementRef, EventEmitter, OnInit } from '@angular/core';
 import { AbstractControl, ControlContainer, ValidationErrors } from '@angular/forms';
 import { UiSimpleComponent } from '../simple/ui-simple.component';
 import * as i0 from "@angular/core";
+declare type PrefixSuffix = {
+    icon: string;
+    tooltip?: string;
+};
 export declare class InputComponent extends UiSimpleComponent implements OnInit {
     protected controlContainer: ControlContainer;
-    prefix: string;
-    suffix: string;
+    prefixIcon: PrefixSuffix;
+    suffixIcon: PrefixSuffix;
     type: 'text' | 'number' | 'password';
     clearButton: boolean;
-    disableUserInput: boolean;
+    activeIcons: boolean;
+    forceHasPrefix: boolean;
+    forceHasSuffix: boolean;
     centered: boolean;
     input: ElementRef | undefined;
+    prefix: ElementRef | undefined;
+    suffix: ElementRef | undefined;
     focusChanged: EventEmitter<boolean>;
     keyPressed: EventEmitter<KeyboardEvent>;
+    get hasPrefix(): boolean;
+    get hasSuffix(): boolean;
     required: boolean;
+    hasFocus: boolean;
     value: string;
     get maxLenRequired(): boolean;
     constructor(controlContainer: ControlContainer);
@@ -25,5 +36,6 @@ export declare class InputComponent extends UiSimpleComponent implements OnInit
     onKeypressed($event: any): void;
     validate(control: AbstractControl): ValidationErrors | null;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputComponent, [{ optional: true; host: true; skipSelf: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "ui-input", never, { "prefix": "prefix"; "suffix": "suffix"; "type": "type"; "clearButton": "clearButton"; "disableUserInput": "disableUserInput"; "centered": "centered"; }, { "focusChanged": "focusChanged"; "keyPressed": "keyPressed"; }, never, ["[slot=prefix]", "[slot=suffix]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "ui-input", never, { "prefixIcon": "prefixIcon"; "suffixIcon": "suffixIcon"; "type": "type"; "clearButton": "clearButton"; "activeIcons": "activeIcons"; "forceHasPrefix": "forceHasPrefix"; "forceHasSuffix": "forceHasSuffix"; "centered": "centered"; }, { "focusChanged": "focusChanged"; "keyPressed": "keyPressed"; }, never, ["[slot=prefix]", "[slot=suffix]"], false, never>;
 }
+export {};

package/lib/services/message-box.service.d.ts

@@ -1,3 +1,4 @@
+import { TemplateRef } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { MatDialog, MatDialogRef } from '@angular/material/dialog';
 import { Observable } from 'rxjs';
@@ -8,6 +9,8 @@ export interface MessageBoxButton {
     text: string;
     kind?: 'basic' | 'flat' | 'stroked';
     color?: 'primary' | 'accent' | 'warn';
+    process?: () => Promise<any>;
+    disabled?: () => boolean;
 }
 export declare class MessageBoxModalComponent {
     dialogRef: MatDialogRef<MessageBoxModalComponent>;
@@ -18,9 +21,12 @@ export declare class MessageBoxModalComponent {
     errorDetail: any;
     buttons: MessageBoxButton[];
     title: string;
+    template: any;
     hideCloseButton: boolean;
+    processing: MessageBoxButton;
     constructor(dialogRef: MatDialogRef<MessageBoxModalComponent>, sanitizer: DomSanitizer, data: any);
     close(result: any): void;
+    buttonClick(b: MessageBoxButton): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MessageBoxModalComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<MessageBoxModalComponent, "ui-message-box-modal", never, {}, {}, never, never, false, never>;
 }
@@ -36,6 +42,16 @@ export declare class MessageBoxService {
         hideCloseButton?: boolean;
         maxWidth?: string;
     }): Observable<any>;
+    open(options?: {
+        buttons?: MessageBoxButton[];
+        title?: string;
+        errorMessage?: string;
+        errorDetail?: string;
+        hideCloseButton?: boolean;
+        maxWidth?: string;
+        message?: string;
+        template?: TemplateRef<any>;
+    }): Observable<any>;
     confirmDelete(title: string, message: string): Observable<any>;
     static ɵfac: i0.ɵɵFactoryDeclaration<MessageBoxService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<MessageBoxService>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rlucan/ui",
-  "version": "14.2.4",
+  "version": "14.2.5",
   "description": "My UI Components",
   "author": "rlucan@gmail.com",
   "peerDependencies": {

package/scss/ui-defaults.scss

@@ -276,10 +276,25 @@
       placeholder: (
         color: rgba($baseTextColor, 0.60)
       ),
-      prefix-suffix: (
-        color: $primaryColor,
+      clear-icon: (
+        color: yellow,
         hover: (
-          color: mat.get-color-from-palette($primaryPalette, 800),
+          color: pink
+        )
+      ),
+      prefix-suffix: (
+        color: mat.get-color-from-palette($primaryPalette, 100),
+        focus: (
+          color: $primaryColor
+        ),
+        active: (
+          color: $primaryColor,
+          hover: (
+            color: mat.get-color-from-palette($primaryPalette, 800),
+          ),
+          disabled: (
+            color: mat.get-color-from-palette(mat.$light-theme-foreground-palette, disabled-text)
+          )
         )
       ),
     ),

package/ui.scss

@@ -126,10 +126,32 @@
 
   ui-input, ui-date {
     .control-container {
-      [slot=suffix], [slot=prefix] {
-        color: uiGetColor($colors, "input.prefix-suffix.color");
+      .xxxclear-icon {
+        color: uiGetColor($colors, "input.clear-icon.color");
         &:hover {
-          color: uiGetColor($colors, "input.prefix-suffix.hover.color");
+          color: uiGetColor($colors, "input.clear-icon.hover.color");
+        }
+      }
+    }
+    .control-container.active-icons {
+      [slot=suffix], [slot=prefix], .prefix-icon, .suffix-icon {
+        color: uiGetColor($colors, "input.prefix-suffix.active.color");
+        &.disabled {
+          color: uiGetColor($colors, "input.prefix-suffix.active.disabled.color");
+        }
+        &:not(.disabled):hover {
+          color: uiGetColor($colors, "input.prefix-suffix.active.hover.color");
+        }
+      }
+    }
+
+    .control-container:not(.active-icons) {
+      [slot=suffix], [slot=prefix], .prefix-icon, .suffix-icon {
+        color: uiGetColor($colors, "input.prefix-suffix.color");
+      }
+      &.has-focus {
+        [slot=suffix], [slot=prefix], .prefix-icon, .suffix-icon {
+          color: uiGetColor($colors, "input.prefix-suffix.focus.color");
         }
       }
     }
@@ -807,6 +829,7 @@ ui-button, ui-action-button, ui-input, ui-date, ui-text-area, ui-select, ui-radi
     width: calc(2.5em / 2);
     height: calc(2.5em / 2);
     flex: 0 0 calc(2.5em / 2);
+    margin: calc(-1 * 2.5em / 4) !important;
   }
   .mdc-checkbox__background {
     height: calc(2.5em / 2);
@@ -890,9 +913,9 @@ ui-button, ui-action-button, ui-input, ui-date, ui-text-area, ui-select, ui-radi
 }
 
 .mat-mdc-checkbox {
-  .mdc-checkbox {
-    margin: -0.5em !important;
-  }
+  //.mdc-checkbox {
+  //  margin: -0.5em !important;
+  //}
   &.mat-mdc-checkbox-disabled {
     opacity: 0.38;
     //label {