cats-ui-lib 2.0.6 → 2.0.8

package/index.d.ts

@@ -2,7 +2,6 @@ import * as i0 from '@angular/core';
 import { EventEmitter, OnInit, OnChanges, TemplateRef, ChangeDetectorRef, ElementRef, SimpleChanges, OnDestroy, Renderer2, QueryList } from '@angular/core';
 import { ControlValueAccessor, Validator, FormControl, AbstractControl, ValidationErrors } from '@angular/forms';
 import { SafeHtml, DomSanitizer } from '@angular/platform-browser';
-import { DatePipe } from '@angular/common';
 
 declare class CatsUiService {
     constructor();
@@ -14,18 +13,24 @@ declare class SingleSelectConfig {
     idField: string;
     textField: string;
     disabledField?: string;
+    colorField?: string;
+    iconField?: string;
     placeholder?: string;
     prefixLabel?: string;
     enableSearch?: boolean;
+    searchPlaceholder?: string;
     required?: boolean;
 }
 declare class MultiSelectConfig {
     idField: string;
     textField: string;
     disabledField?: string;
+    colorField?: string;
+    iconField?: string;
     placeholder?: string;
     prefixLabel?: string;
     enableSearch?: boolean;
+    searchPlaceholder?: string;
     chipLimit: number;
     selectAll?: boolean;
     required?: boolean;
@@ -42,6 +47,8 @@ declare class InputConfig {
 declare class AutoCompleteSingleSelectConfig {
     idField: string;
     textField: string;
+    colorField?: string;
+    iconField?: string;
     disabledField?: string;
     placeholder?: string;
     required?: boolean;
@@ -51,6 +58,8 @@ declare class AutoCompleteMultiSelectConfig {
     idField: string;
     textField: string;
     disabledField?: string;
+    colorField?: string;
+    iconField?: string;
     selectAll?: boolean;
     placeholder?: string;
     required?: boolean;
@@ -85,10 +94,6 @@ interface RadioButtonConfig {
     name: string;
     layout?: 'horizontal' | 'vertical';
 }
-interface DateConfig {
-    selectionMode: 'single' | 'range';
-    enableTime?: boolean;
-}
 
 declare class InputComponent implements ControlValueAccessor, Validator {
     inputConfig: InputConfig;
@@ -601,199 +606,6 @@ declare class RadioButtonComponent implements ControlValueAccessor {
     static ɵcmp: i0.ɵɵComponentDeclaration<RadioButtonComponent, "cats-ui-radio-button", never, { "config": { "alias": "config"; "required": false; }; "optionList": { "alias": "optionList"; "required": false; }; "selectedRadio": { "alias": "selectedRadio"; "required": false; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
 }
 
-interface IRange {
-    value: Date;
-    label: string;
-}
-declare class DateTimePickerComponent implements OnInit, OnChanges, ControlValueAccessor {
-    private locale;
-    private cd;
-    private datePipe;
-    dateTimeSelected: EventEmitter<any>;
-    dateConfig: DateConfig;
-    minDate?: string;
-    maxDate?: string;
-    preSelectedValue: any;
-    selectedDateTime: any;
-    currentDate: Date;
-    currentMonth: number;
-    currentYear: number;
-    selectedDate: number | null;
-    selectedTime: string | null;
-    calendar: number[][];
-    timeSlots: IRange[];
-    rangeStart: number | null;
-    rangeEnd: number | null;
-    selectedMonth: any;
-    selectedYear: any;
-    control: AbstractControl<any, any>;
-    disableControl: boolean;
-    date: any;
-    calendarView: string;
-    yearRange: number[];
-    daysInMonth: any[];
-    selectedDay: number;
-    selectedStartDate: any;
-    selectedEndDate: any;
-    isOpen: boolean;
-    showYearSelector: boolean;
-    monthRange: any;
-    constructor(locale: string, cd: ChangeDetectorRef, datePipe: DatePipe);
-    ngOnChanges(_changes: SimpleChanges): void;
-    ngOnInit(): void;
-    private onTouchedCallback;
-    private onChangeCallback;
-    writeValue(value: any): void;
-    registerOnChange(fn: any): void;
-    registerOnTouched(fn: any): void;
-    setDisabledState(isDisabled: boolean): void;
-    /**
-     * @description Validates date time picker component
-     * @author Shiva Kant
-     * @param control
-     * @returns validate
-     */
-    validate(control: AbstractControl): ValidationErrors | null;
-    /**
-     * @description method to toggleCalendar
-     * @author Shiva Kant
-     */
-    toggleCalendar(): void;
-    /**
-     * @description Closes calendar
-     * @author Shiva Kant
-     */
-    closeCalendar(): void;
-    /**
-     * @description Method to Gets month year
-     * @author Shiva Kant
-     * @returns month year
-     */
-    getMonthYear(): {
-        month: string;
-        year: string;
-    };
-    /**
-     * @description Method to Updates current year month
-     * @author Shiva Kant
-     */
-    updateCurrentYearMonth(): void;
-    /**
-     * @description Method to Selects year
-     * @author Shiva Kant
-     * @param year
-     */
-    selectYear(year: number): void;
-    /**
-     * @description Method to Selects month
-     * @author Shiva Kant
-     * @param month
-     */
-    selectMonth(month: any): void;
-    /**
-     * @description Method to Previous year range
-     * @author Shiva Kant
-     */
-    previousYearRange(): void;
-    /**
-     * @description Method to Next year range
-     * @author Shiva Kant
-     */
-    nextYearRange(): void;
-    /**
-     * @description Method to Toggles year selector
-     * @author Shiva Kant
-     */
-    toggleYearSelector(): void;
-    /**
-     * @description Method to Generates year range
-     * @author Shiva Kant
-     */
-    generateYearRange(): void;
-    /**
-     * @description Method to Determines whether date selectable is
-     * @author Shiva Kant
-     * @param date
-     * @returns true if date selectable
-     */
-    isDateSelectable(date: Date): boolean;
-    /**
-     * @description Method to Determines whether day disabled is
-     * @author Shiva Kant
-     * @param day
-     * @returns true if day disabled
-     */
-    isDayDisabled(day: number): boolean;
-    /**
-     * @description Method to Generates calendar
-     * @author Shiva Kant
-     */
-    generateCalendar(): void;
-    /**
-     * @description Method to Previous month
-     * @author Shiva Kant
-     */
-    previousMonth(): void;
-    /**
-     * @description Method to Next month
-     * @author Shiva Kant
-     */
-    nextMonth(): void;
-    /**
-     * @description Method to Initializes calendar when preSelectedValue  date
-     * @author Shiva Kant
-     * @returns calendar
-     */
-    initializeCalendar(): void;
-    /**
-     * @description Method to Selects date
-     * @author Shiva Kant
-     * @param date
-     */
-    selectDate(date: number): void;
-    /**
-     * @description Method to Selects time
-     * @author Shiva Kant
-     * @param time
-     */
-    selectTime(time: string): void;
-    /**
-     * @description Method to Determines whether selected date is
-     * @author Shiva Kant
-     * @param date
-     * @returns
-     */
-    isSelectedDate(date: number, month: number, year: number): boolean;
-    /**
-     * @description Method to Generates time ranges
-     * @author Shiva Kant
-     */
-    generateTimeRanges(): void;
-    /**
-     * @description Method to Formats time
-     * @author Shiva Kant
-     * @param date
-     * @returns time
-     */
-    formatTime(date: Date): string;
-    /**
-     * @description Method to Formats date time
-     * @author Shiva Kant
-     * @param fullDate
-     * @param selectedTime
-     * @returns date time
-     */
-    formatDateTime(fullDate: Date, selectedTime: string | null): string;
-    /**
-     * @description Method to Emits date time
-     * @author Shiva Kant
-     * @returns date time
-     */
-    emitDateTime(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DateTimePickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DateTimePickerComponent, "cats-ui-date-time-picker", never, { "dateConfig": { "alias": "dateConfig"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "preSelectedValue": { "alias": "preSelectedValue"; "required": false; }; }, { "dateTimeSelected": "dateTimeSelected"; }, never, never, true, never>;
-}
-
 type DatePickerMode = 'single' | 'range' | 'dual';
 interface DatePickerConfig {
     mode?: DatePickerMode;
@@ -822,7 +634,7 @@ interface DateTimeResult {
     meridiem: 'AM' | 'PM';
 }
 type CalenderView = 'day' | 'year' | 'month';
-declare class CustomDatePickerComponent implements OnInit, ControlValueAccessor {
+declare class CustomDatePickerComponent implements OnInit, ControlValueAccessor, OnChanges {
     private elRef;
     config: DatePickerConfig;
     label: string;
@@ -858,6 +670,7 @@ declare class CustomDatePickerComponent implements OnInit, ControlValueAccessor
     activeCalendar: 'primary' | 'secondary';
     monthNames: string[];
     constructor(elRef: ElementRef);
+    ngOnChanges(changes: SimpleChanges): void;
     ngOnInit(): void;
     get mode(): DatePickerMode;
     get showDateLabel(): boolean;
@@ -1007,42 +820,6 @@ declare class AccordionItemComponent {
     static ɵcmp: i0.ɵɵComponentDeclaration<AccordionItemComponent, "cats-ui-accordion-item", never, { "title": { "alias": "title"; "required": false; }; "index": { "alias": "index"; "required": false; }; }, {}, ["contentTemplate"], never, true, never>;
 }
 
-declare class TabContentDirective {
-    template: TemplateRef<any>;
-    constructor(template: TemplateRef<any>);
-    static ɵfac: i0.ɵɵFactoryDeclaration<TabContentDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TabContentDirective, "[tabContent]", never, {}, {}, never, never, true, never>;
-}
-
-declare class TabHeadingDirective {
-    template: TemplateRef<any>;
-    constructor(template: TemplateRef<any>);
-    static ɵfac: i0.ɵɵFactoryDeclaration<TabHeadingDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TabHeadingDirective, "[tabHeading]", never, {}, {}, never, never, true, never>;
-}
-
-declare class TabItemComponent {
-    heading: TabHeadingDirective;
-    content: TabContentDirective;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TabItemComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TabItemComponent, "cats-ui-tab-item", never, {}, {}, ["heading", "content"], never, true, never>;
-}
-
-declare class TabComponent {
-    activeTab: number;
-    disabledTabs: number[];
-    selectTab: EventEmitter<number>;
-    items: QueryList<TabItemComponent>;
-    /**
-     * @description Sets active
-     * @author Shiva Kant
-     * @param index
-     */
-    setActive(index: number): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TabComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TabComponent, "cats-ui-tab", never, { "activeTab": { "alias": "activeTab"; "required": false; }; "disabledTabs": { "alias": "disabledTabs"; "required": false; }; }, { "selectTab": "selectTab"; }, ["items"], never, true, never>;
-}
-
 declare class TabContentComponent {
     active: boolean;
     tabId: number;
@@ -1093,8 +870,10 @@ interface TimeFilterOption {
     children?: TimeFilterOption[];
     default?: boolean;
     custom?: boolean;
+    parentDateFormat?: 'dd MMM yyyy' | 'MM/dd/yyyy' | 'yyyy-MM-dd';
     pickerMode?: DatePickerMode;
     time?: boolean;
+    extraConfig?: Partial<DatePickerConfig>;
 }
 interface TimeFilterConfig {
     title?: string;
@@ -1104,36 +883,58 @@ interface TimeFilterConfig {
 interface TimeFilterOutput {
     type: FilterType;
     label?: string;
-    startDate?: Date;
-    endDate?: Date;
+    startDate?: string;
+    endDate?: string;
     value?: number;
     unit?: 'Hours' | 'Days';
     key?: string;
+    dates?: any;
+}
+interface TimeFilterValue {
+    type: string;
+    dates?: any;
+    lastValue?: number;
+    lastUnit?: 'seconds' | 'minutes' | 'hours' | 'days';
 }
-declare class TimestampFilterComponent {
+declare class TimestampFilterComponent implements OnInit {
+    private cdr;
     config: TimeFilterConfig;
     selectionChange: EventEmitter<TimeFilterOutput>;
-    selectedValue: string | null;
+    selectedValue: TimeFilterValue | null;
+    radioValue: string | null;
+    previousRadioValue: string | null;
     activePicker: TimeFilterOption | null;
     lastValue: number;
-    lastUnit: 'Hours' | 'Days';
+    lastUnit: 'seconds' | 'minutes' | 'hours' | 'days';
+    selectedDateLabels: Record<string, string>;
+    dateControls: Record<string, FormControl>;
     get normalOptions(): TimeFilterOption[];
     get customOptions(): TimeFilterOption[];
+    /** Returns the FormControl for the currently active picker. */
+    get activePickerControl(): FormControl | null;
+    constructor(cdr: ChangeDetectorRef);
     ngOnInit(): void;
+    private applyPreset;
     getPickerConfig(option: TimeFilterOption): DatePickerConfig;
     selectOption(option: TimeFilterOption): void;
-    private startOfDay;
-    private startOfWeek;
-    private startOfFinancialYear;
-    private subtractTime;
+    onDateApplied(event: any): void;
+    /**
+     * Cancel: restore radio to whatever was selected before picker opened.
+     */
+    onCancel(_event: any): void;
     emitLast(): void;
     onLastChange(): void;
     reset(): void;
+    private extractStartDate;
+    private extractEndDate;
+    private buildDateLabel;
     private emit;
-    onDateApplied(event: any): void;
-    applied(dt: any): void;
+    private startOfDay;
+    private startOfWeek;
+    private startOfFinancialYear;
+    private subtractTime;
     static ɵfac: i0.ɵɵFactoryDeclaration<TimestampFilterComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TimestampFilterComponent, "cats-ui-timestamp-filter", never, { "config": { "alias": "config"; "required": true; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimestampFilterComponent, "cats-ui-timestamp-filter", never, { "config": { "alias": "config"; "required": true; }; "selectedValue": { "alias": "selectedValue"; "required": false; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
 }
 
 declare class WizardService {
@@ -1171,12 +972,13 @@ declare class WizardComponent {
     showStepBadge: boolean;
     expandable: boolean;
     isExpanded: boolean;
-    toggleExpand(): void;
     steps: any;
     activeStep: any;
     templates: WizardStepDirective[];
     constructor(commonService: WizardService);
     ngAfterContentInit(): void;
+    toggleExpand(): void;
+    onEscPressed(): void;
     get currentStepIndex(): number;
     get wizardSteps(): any[];
     get currentTemplate(): i0.TemplateRef<any>;
@@ -1185,8 +987,33 @@ declare class WizardComponent {
     goToStep(step: number): void;
     closeModal(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<WizardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<WizardComponent, "cats-ui-wizard", never, { "wizardId": { "alias": "wizardId"; "required": false; }; "title": { "alias": "title"; "required": false; }; "showProgressBar": { "alias": "showProgressBar"; "required": false; }; "showStepBadge": { "alias": "showStepBadge"; "required": false; }; "expandable": { "alias": "expandable"; "required": false; }; }, { "closed": "closed"; }, ["stepTemplates"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<WizardComponent, "cats-ui-wizard", never, { "wizardId": { "alias": "wizardId"; "required": false; }; "title": { "alias": "title"; "required": false; }; "showProgressBar": { "alias": "showProgressBar"; "required": false; }; "showStepBadge": { "alias": "showStepBadge"; "required": false; }; }, { "closed": "closed"; }, ["stepTemplates"], never, true, never>;
+}
+
+declare class FileUploadComponent implements ControlValueAccessor {
+    label: string;
+    placeholder: string;
+    errorMessage: string;
+    disabled: boolean;
+    multiple: boolean;
+    buttonPosition: 'left' | 'right';
+    value: File[];
+    isFocused: boolean;
+    onChange: (value: File[]) => void;
+    onTouched: () => void;
+    writeValue(files: File[]): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    onFileSelect(event: any, input: HTMLInputElement): void;
+    onDrop(event: DragEvent): void;
+    onDragOver(event: DragEvent): void;
+    removeFile(index: number, input?: HTMLInputElement): void;
+    get isFilled(): boolean;
+    get hasError(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadComponent, "cats-ui-file-upload", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "buttonPosition": { "alias": "buttonPosition"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-export { AccordionComponent, AccordionItemComponent, AutoCompleteMultiSelectComponent, AutoCompleteMultiSelectConfig, AutoCompleteSingleSelectComponent, AutoCompleteSingleSelectConfig, CatsUiService, CatsUiTooltipDirective, CheckBoxConfig, CheckBoxSubtask, CheckboxButtonComponent, CustomDatePickerComponent, DROPDOWN_CONTROL_VALUE_ACCESSOR, DROPDOWN_CONTROL_VALUE_VALIDATOR, DateTimePickerComponent, InputComponent, InputConfig, MULTI_SELECT_CONTROL_VALUE_ACCESSOR, MULTI_SELECT_CONTROL_VALUE_VALIDATOR, MultiSelectComponent, MultiSelectConfig, OutsideClickDirective, RadioButtonComponent, SINGLE_SELECT_CONTROL_VALUE_ACCESSOR, SINGLE_SELECT_CONTROL_VALUE_VALIDATOR, SearchBoxComponent, SearchConfig, SingleSelectComponent, SingleSelectConfig, TabComponent, TabContentComponent, TabContentDirective, TabHeadingDirective, TabItemComponent, TabsetComponent, TimestampFilterComponent, ToggleConfig, ToogleButtonComponent, WizardComponent, WizardService, WizardStepDirective };
-export type { CalenderView, DateConfig, DatePickerConfig, DatePickerMode, DateRange, DateTimeResult, FilterType, RadioButtonConfig, TabConfig, TabItem, TimeFilterConfig, TimeFilterOption, TimeFilterOutput };
+export { AccordionComponent, AccordionItemComponent, AutoCompleteMultiSelectComponent, AutoCompleteMultiSelectConfig, AutoCompleteSingleSelectComponent, AutoCompleteSingleSelectConfig, CatsUiService, CatsUiTooltipDirective, CheckBoxConfig, CheckBoxSubtask, CheckboxButtonComponent, CustomDatePickerComponent, DROPDOWN_CONTROL_VALUE_ACCESSOR, DROPDOWN_CONTROL_VALUE_VALIDATOR, FileUploadComponent, InputComponent, InputConfig, MULTI_SELECT_CONTROL_VALUE_ACCESSOR, MULTI_SELECT_CONTROL_VALUE_VALIDATOR, MultiSelectComponent, MultiSelectConfig, OutsideClickDirective, RadioButtonComponent, SINGLE_SELECT_CONTROL_VALUE_ACCESSOR, SINGLE_SELECT_CONTROL_VALUE_VALIDATOR, SearchBoxComponent, SearchConfig, SingleSelectComponent, SingleSelectConfig, TabContentComponent, TabsetComponent, TimestampFilterComponent, ToggleConfig, ToogleButtonComponent, WizardComponent, WizardService, WizardStepDirective };
+export type { CalenderView, DatePickerConfig, DatePickerMode, DateRange, DateTimeResult, FilterType, RadioButtonConfig, TabConfig, TabItem, TimeFilterConfig, TimeFilterOption, TimeFilterOutput, TimeFilterValue };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cats-ui-lib",
-  "version": "2.0.6",
+  "version": "2.0.8",
   "peerDependencies": {
     "@angular/core": ">=18 <22",
     "@angular/common": ">=18 <22"

package/styles/_utilities.scss

@@ -17,7 +17,7 @@
 }
 
 // ------------------Button Styles--------------------
-button.button {
+button.cats-btn {
   border: rem(1px) solid transparent;
   padding: 0 rem(28px);
   height: rem(56px);
@@ -805,11 +805,24 @@ button.button {
 }
 
 // ------------------Checkbox Styles--------------------
-.checkbox-container {
+.checkbox-container,
+.item, .multiitem {
   @include flex(flex-start, center, rem(8px));
   @include fontStyle(var(--fs-16), rem(20px), 400);
   margin-bottom: rem(8px);
   color: var(--text-heading-primary);
+  &.disabled-option{
+    input[type="checkbox"]:checked{
+      background-color: var(--surface-background-subtle);
+      border-color: var(--border-core-default);
+      &::after{
+        background-image: url(/images/check-disabled.svg);
+      }
+    }
+    &::selection{
+      background-color: transparent;
+    }
+  }
 
   input[type="checkbox"] {
     appearance: none;