monkey-style-guide-v2 0.0.30 → 0.0.32

package/lib/components/index.d.ts

@@ -18,6 +18,7 @@ export * from './icon';
 export * from './icon-button';
 export * from './input';
 export * from './input-code';
+export * from './input-date-range';
 export * from './input-phone';
 export * from './input-upload';
 export * from './modal';

package/{assets/scss/typography/_index.scss → lib/components/input-date-range/index.d.ts}

@@ -1,7 +1,6 @@
-/**************************
+/** ************************
  * Copyright Monkey Exchange. All Rights Reserved
  * This style guide was developed by Monkey Exchange Team
  * MIT Licence
-**************************/
-
-@use 'styles';
+ ************************* */
+export * from './input-date-range.component';

package/lib/components/input-date-range/input-date-range.component.d.ts

@@ -0,0 +1,57 @@
+import { AfterContentInit, ElementRef, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
+import { ControlValueAccessor, NgControl } from '@angular/forms';
+import { Subject } from 'rxjs';
+import { MonkeyFormFieldComponent, MonkeyFormFieldControl } from '../form-field';
+import * as i0 from "@angular/core";
+export declare class MonkeyInputDateRangeComponent implements MonkeyFormFieldControl, ControlValueAccessor, AfterContentInit, OnDestroy, OnChanges {
+    formField: MonkeyFormFieldComponent;
+    placeholder: string;
+    title: string;
+    tabIndex: number;
+    minDate: Date | string;
+    maxDate: Date | string;
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    _disabled: boolean;
+    get required(): boolean;
+    set required(value: boolean);
+    private _required;
+    set value(value: any);
+    get value(): any;
+    _value: string | null;
+    constructor(formField: MonkeyFormFieldComponent);
+    ngControl: NgControl | null;
+    private readonly idGenerator;
+    readonly id: string;
+    focused: boolean;
+    readonly type: string;
+    readonly stateChanges: Subject<void>;
+    protected _elementRef: ElementRef<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>;
+    _onChange: any;
+    _onTouched: any;
+    showPopOver: boolean;
+    startDate: string;
+    endDate: string;
+    handledMinDate: string;
+    handledMaxDate: string;
+    get elementTarget(): any;
+    closePopOver: () => void;
+    ngAfterContentInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    onContainerClick(event: MouseEvent): void;
+    _onFocus(): void;
+    _onBlur(): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    private handleValue;
+    private validateValue;
+    writeValue(value: any): void;
+    onOpenPopover(): void;
+    onHandleDate(event: any): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyInputDateRangeComponent, [{ optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyInputDateRangeComponent, "monkey-input-date-range", never, { "placeholder": { "alias": "placeholder"; "required": true; }; "title": { "alias": "title"; "required": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_required: unknown;
+}

package/lib/components/option/option.component.d.ts

@@ -1,14 +1,9 @@
-/** ************************
- * Copyright Monkey Exchange. All Rights Reserved
- * This style guide was developed by Monkey Exchange Team
- * MIT Licence
- ************************* */
 import { ElementRef } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare class MonkeyOptionComponent {
     private readonly idGenerator;
     _content: ElementRef<HTMLElement> | undefined;
-    value: any;
+    readonly value: import("@angular/core").InputSignal<any>;
     disabled: boolean;
     type: string;
     get displayContent(): string;
@@ -20,6 +15,6 @@ export declare class MonkeyOptionComponent {
     onClick(event: MouseEvent): void;
     handleKeyDown(event: KeyboardEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyOptionComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyOptionComponent, "monkey-option", never, { "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyOptionComponent, "monkey-option", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_disabled: unknown;
 }

package/lib/components/select/select.component.d.ts

@@ -17,12 +17,11 @@ export declare class MonkeySelectComponent implements MonkeyFormFieldControl, Co
     options: QueryList<MonkeyOptionComponent>;
     tabIndex: number;
     onChange: EventEmitter<any>;
-    onSearch: EventEmitter<any>;
     placeholder: string;
     loading: boolean;
     showSearch: boolean;
     searchPlaceholder: string;
-    callbackSearch: boolean;
+    type: string;
     get disabled(): boolean;
     set disabled(value: boolean);
     get required(): boolean;
@@ -43,7 +42,6 @@ export declare class MonkeySelectComponent implements MonkeyFormFieldControl, Co
     readonly id: string;
     readonly percent: boolean;
     readonly stateChanges: Subject<void>;
-    readonly type: string;
     readonly searchHandle: EventEmitter<string>;
     readonly searchDictionary: import("rxjs").Observable<any>;
     readonly loadingDictionary: import("rxjs").Observable<any>;
@@ -62,6 +60,7 @@ export declare class MonkeySelectComponent implements MonkeyFormFieldControl, Co
     private updateSelectedLabel;
     private executeSearch;
     private repositionScroll;
+    private getComparationValue;
     ngOnInit(): void;
     ngAfterContentInit(): void;
     ngOnDestroy(): void;
@@ -80,10 +79,9 @@ export declare class MonkeySelectComponent implements MonkeyFormFieldControl, Co
     ngOnChanges(changes: SimpleChanges): void;
     onHandleSearch(event: Event): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MonkeySelectComponent, [null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeySelectComponent, "monkey-select", never, { "tabIndex": { "alias": "tabIndex"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": true; }; "loading": { "alias": "loading"; "required": false; }; "showSearch": { "alias": "showSearch"; "required": false; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; }; "callbackSearch": { "alias": "callbackSearch"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "onChange": "onChange"; "onSearch": "onSearch"; }, ["options"], ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeySelectComponent, "monkey-select", never, { "tabIndex": { "alias": "tabIndex"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": true; }; "loading": { "alias": "loading"; "required": false; }; "showSearch": { "alias": "showSearch"; "required": false; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; }; "type": { "alias": "type"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "onChange": "onChange"; }, ["options"], ["*"], true, never>;
     static ngAcceptInputType_loading: unknown;
     static ngAcceptInputType_showSearch: unknown;
-    static ngAcceptInputType_callbackSearch: unknown;
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_required: unknown;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "monkey-style-guide-v2",
-  "version": "0.0.30",
+  "version": "0.0.32",
   "peerDependencies": {
     "@angular/common": "^19.2.14",
     "@angular/core": "^19.2.14",

package/assets/scss/typography/_styles.scss

@@ -1,194 +0,0 @@
-/** ************************
- * Copyright Monkey Exchange. All Rights Reserved
- * This style guide was developed by Monkey Exchange Team
- * MIT Licence
- ************************* */
-
-@use '../partials/variables';
-
-* {
-  font-family: var(--mecx-font-name), arial, sans-serif;
-  -webkit-font-smoothing: auto;
-  -moz-osx-font-smoothing: auto;
-}
-
-body {
-  margin: 0;
-  padding: 0;
-  background-color: var(--mecx-color-white);
-}
-
-h1 {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xxl)
-  //   )
-  // );
-}
-
-h2 {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xl)
-  //   )
-  // );
-}
-
-h3 {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(lg)
-  //   )
-  // );
-}
-
-h4 {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(md)
-  //   )
-  // );
-}
-
-h5 {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(sm)
-  //   )
-  // );
-}
-
-h6 {
-  // @include mecx-font;
-}
-
-p {
-  // @include mecx-font;
-}
-
-a {
-  // text-decoration: none;
-  // cursor: pointer;
-
-  // @include mecx-font(
-  //   (
-  //     color: var(--mecx-color-link)
-  //   )
-  // );
-
-  // &:hover {
-  //   text-decoration: underline;
-  // }
-}
-
-.bg {
-  // @include gray-cl('background-color');
-  // @include theme-cl('background-color');
-  // @include warning-cl('background-color');
-  // @include success-cl('background-color');
-}
-
-.txt {
-  // @include gray-cl;
-  // @include theme-cl;
-  // @include warning-cl;
-  // @include success-cl;
-  // @include error-cl;
-  // @include align;
-  // @include sizes;
-  // @include weight;
-  // @include line-height;
-
-  &-none {
-    text-decoration: none;
-  }
-
-  &-underline {
-    text-decoration: underline;
-  }
-
-  &-upper {
-    text-transform: uppercase;
-  }
-
-  &-lower {
-    text-transform: lowercase;
-  }
-
-  &-capitalize {
-    text-transform: capitalize;
-  }
-
-  &-shadow {
-    // text-shadow: 2px 2px 4px;
-    // color: f-cl-gray(700);
-  }
-}
-
-.mecx-title-page {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xl),
-  //     weight: f-weight(bold),
-  //     height: f-lh(super),
-  //     color: f-cl-gray(900)
-  //   )
-  // );
-
-  // font-style: normal;
-}
-
-.mecx-subtitle-page {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xs),
-  //     weight: f-weight(regular),
-  //     height: f-lh(med),
-  //     color: f-cl-gray(700)
-  //   )
-  // );
-
-  // font-style: normal;
-  // letter-spacing: 0.48px;
-}
-
-.mecx-description {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xs),
-  //     weight: f-weight(regular),
-  //     height: f-lh(md)
-  //   )
-  // );
-}
-
-.mecx-title {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xxs),
-  //     weight: f-weight(regular),
-  //     height: f-lh(md),
-  //     color: f-cl-gray(700)
-  //   )
-  // );
-}
-
-.mecx-value {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xxs),
-  //     weight: f-weight(regular),
-  //     height: f-lh(md)
-  //   )
-  // );
-}
-
-.mecx-label {
-  // @include mecx-font(
-  //   (
-  //     size: f-size(xxs),
-  //     weight: f-weight(regular),
-  //     height: f-lh(md)
-  //   )
-  // );
-}