carriera-intern 0.0.0

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/components/cai-custom-datetime-pickers-date-calendars/cai-custom-datetime-pickers-date-calendars.component.ts

@@ -0,0 +1,163 @@
+import {
+  Component,
+  Input,
+  OnInit,
+  Output,
+  EventEmitter,
+  OnDestroy,
+} from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { Subject, Subscription, takeUntil } from 'rxjs';
+
+// moment
+import moment from 'moment';
+
+// services
+import { CalendarDateTimePickerService } from '../../services/calendar-datetime-picker.service';
+
+// constants
+import { RANGE, STARTING_YEAR } from '../../strategy/calendar-strategy';
+import { CustomDatetimePickersConstants } from '../../utils/constants/custom-datetime-pickers.constants';
+
+// components
+import { CaCustomDateTimePickerCalendarDatesMainComponent } from '../cai-custom-datetime-pickers-calendar-dates-main/cai-custom-datetime-pickers-calendar-dates-main.component';
+import { CaCustomDateTimePickersCalendarLeftComponent } from '../cai-custom-datetime-pickers-calendar-left/cai-custom-datetime-pickers-calendar-left.component';
+
+// enums
+import { CalendarListPreviewStringEnum } from '../../enums/calendar-list-preview-string.enum';
+
+@Component({
+  selector: 'cai-custom-datetime-pickers-date-calendars',
+  templateUrl: './cai-custom-datetime-pickers-date-calendars.component.html',
+  styleUrls: ['./cai-custom-datetime-pickers-date-calendars.component.scss'],
+  imports: [
+    CommonModule,
+    FormsModule,
+    CaCustomDateTimePickerCalendarDatesMainComponent,
+    CaCustomDateTimePickersCalendarLeftComponent,
+  ],
+})
+export class CaCustomDateTimePickersDateCalendarsComponent
+  implements OnInit, OnDestroy
+{
+  @Input() listPreview!: string;
+  @Input() dateTime!: Date;
+  @Input() isMonthAndYearOnly: boolean = false;
+  @Output() setListPreviewValue = new EventEmitter();
+  @Output() onRefocusInput = new EventEmitter();
+
+  private currentYear: number = new Date().getFullYear();
+  private currentMonth: number = new Date().getMonth();
+  private activeMonth: number = 0;
+  private subscription?: Subscription;
+  private destroy$ = new Subject<void>();
+  private monthNames: string[] = CustomDatetimePickersConstants.monthNames;
+  public dayOfWeekLetters: string[] =
+    CustomDatetimePickersConstants.dayOfWeekLetters;
+
+  public activeIndex: number = 0;
+  public currentIndex!: number;
+  public currentYearIndex!: number;
+  public monthYearsIndx: string[] = [];
+  public months: Date[] = Array.from({ length: RANGE }, (_, i) => {
+    const year = STARTING_YEAR + Math.floor(i / 12);
+    const month = i % 12;
+    if (year === this.currentYear && month === this.currentMonth) {
+      this.currentIndex = i;
+      this.activeIndex = i;
+    }
+    const sendDate = new Date(year, month, 1);
+    this.monthYearsIndx.push(moment(sendDate).format('MM/DD/YY'));
+    return sendDate;
+  });
+
+  public justYears: Date[] = Array.from({ length: 100 }, (_, i) => {
+    const year = STARTING_YEAR + i;
+    if (year === this.currentYear) this.currentYearIndex = i;
+
+    return new Date(STARTING_YEAR + i, 1, 1);
+  });
+
+  public selectedYear!: number;
+  public selectedMonth!: string;
+
+  constructor(private calendarService: CalendarDateTimePickerService) {}
+
+  ngOnInit(): void {
+    this.initInitalState();
+    this.initScrollListener();
+  }
+
+  public initScrollListener(): void {
+    this.calendarService.scrolledIndexChange
+      .pipe(takeUntil(this.destroy$))
+      .subscribe((res: { indx: number }) => {
+        this.activeIndex = res.indx;
+        this.onMonthChange(res.indx);
+      });
+  }
+
+  public initInitalState(): void {
+    this.selectedMonth = this.monthNames[this.dateTime.getMonth()];
+    this.selectedYear = this.dateTime.getFullYear();
+
+    if (this.calendarService.selectedIndex)
+      this.activeIndex = this.calendarService.selectedIndex;
+
+    if (this.isMonthAndYearOnly)
+      this.currentYearIndex = this.justYears.findIndex(
+        (year) => year.getFullYear() === this.selectedYear,
+      );
+  }
+
+  public onMonthChange(month: number): void {
+    this.listPreview === CalendarListPreviewStringEnum.FULL_LIST
+      ? (this.selectedYear = this.months[month].getFullYear())
+      : (this.selectedYear = this.justYears[month].getFullYear());
+
+    this.selectedMonth = this.monthNames[this.months[month].getMonth()];
+    this.activeMonth = month;
+  }
+
+  public getMonth(index: number): string {
+    return CustomDatetimePickersConstants.monthNames[index];
+  }
+
+  public setListPreview(event: Event): void {
+    event?.stopPropagation();
+    if (this.listPreview === CalendarListPreviewStringEnum.FULL_LIST) {
+      this.setListPreviewValue.emit(CalendarListPreviewStringEnum.MONTH_LIST);
+      this.calendarService.setAutoIndex = Math.floor(this.activeIndex / 12);
+    }
+  }
+
+  public setListPreviewToFull(num: number): void {
+    this.setListPreviewValue.emit(CalendarListPreviewStringEnum.FULL_LIST);
+    this.setAutoIndex(num);
+  }
+
+  public setAutoIndex(num: number): void {
+    this.calendarService.setAutoIndex = this.activeIndex * 12 + num;
+  }
+
+  public selectCurrentDay(event: Event): void {
+    event?.stopPropagation();
+    const new_date = moment(new Date()).format();
+    this.calendarService.dateChanged.next(new_date);
+    this.setListPreviewValue.emit(CalendarListPreviewStringEnum.FULL_LIST);
+  }
+
+  public refocusInput(event: Event): void {
+    event?.stopPropagation();
+    event?.preventDefault();
+    this.onRefocusInput.emit(event);
+  }
+
+  ngOnDestroy() {
+    if (this.subscription) this.subscription.unsubscribe();
+    this.destroy$.next();
+    this.destroy$.complete();
+  }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/config/cai-input.config.ts

@@ -0,0 +1,193 @@
+export interface IMultipleInput {
+    id?: number;
+    value: string | number;
+    second_value?: string | number;
+    logoName?: string;
+    isImg?: boolean;
+    isSvg?: boolean;
+    folder?: string;
+    subFolder?: string;
+    logoType?: string;
+    isOwner?: boolean;
+    isProgressBar?: boolean;
+    isCounter?: boolean;
+}
+
+export interface ICaInputDateTimePicker {
+    name: string;
+    isIconHidden?: boolean;
+    customClass?: string; // - 'datetimeclass' -> date/time pickers, 'datetimeclass dark -> date/time pickers dark
+    isDisabled?: boolean;
+    isFutureDateDisabled?: boolean; // disabled future dates
+    expiredDateInvalid?: boolean; // accept only dates that didn't expire
+    isFromDate?: boolean;
+}
+
+
+export interface ICaInputWithDropdown {
+    withText: boolean;
+    svg: boolean;
+    image: boolean;
+    iconsPath?: string;
+    activeItemIconKey?: string;
+    url?: string;
+    nameInitialsInsteadUrl?: string; // if url does not exist, but must render initials of name
+    template?: string; // truck, trailer...
+    color?: string; // colors store in backe-end dynamicly
+    class?: string; // colors store in front-end
+    remove?: boolean; // remove svg in focus mode and when user are typing
+}
+export interface ICaInput {
+    id?: number; // only for form array to indefier element
+    name: string;
+    type: string;
+    label?: string;
+    labelInInput?: boolean;
+    placeholder?: string; // only for dropdown, otherwise placeholder is label !!!
+    placeholderIcon?: string;
+    placeholderIconRightSide?: string;
+    isPlaceHolderIconRightSideDynamicColor?: boolean;
+    placeholderIconFolllowTextOnRightSide?: string;
+    placeholderIconColor?: string;
+    placeholderWithLabel?: boolean; // when you want label to be always up
+    placeholderText?: string;
+    placeholderInsteadOfLabel?: boolean;
+    inputCursorOnRightSide?: boolean;
+    isRequired?: boolean;
+    isDisabled?: boolean;
+    pattern?: string;
+    autocomplete?: string;
+    showCount?: boolean;
+    minLength?: number;
+    maxLength?: number;
+    minValue?: number;
+    maxValue?: number;
+    min?: number;
+    max?: number;
+    step?: number; // step for input type="number";
+    mask?: string; // only for phone type of input
+    textTransform?:
+        | 'capitalize'
+        | 'uppercase'
+        | 'lowercase'
+        | 'capitalizedcase';
+    textAlign?: string | 'center';
+    blackInput?: boolean; // has only black background && input clear, no validations
+    blueInput?: boolean;
+    incorrectInput?: boolean;
+    dangerMark?: boolean;
+    autoFocus?: boolean;
+    hideClear?: boolean;
+    hideRequiredCheck?: boolean;
+    hideErrorMessage?: boolean;
+    hideDangerMark?: boolean;
+    hideDropdownArrow?: boolean;
+    requiredLabel?: boolean;
+    errorInsideInput?: boolean;
+    removeInput?: boolean;
+    readOnly?: boolean;
+    thousandSeparator?: boolean; // type of input must be 'text'
+    priceSeparator?: boolean;
+    priceSeparatorLimitation?: number; // 7 - 999,999.00 ; 6 - 99,000.00 ; 5 - 9,000.00 itd... (must including and comma)
+    loadingSpinner?: {
+        size?: string; // small, big
+        color?: string; // black, gray, white, blueLight, blueDark
+        isLoading?: boolean;
+    };
+    addressFlag?: string; // added text in right corner and this flag will be disabled clear button, invalid danger mark
+    customClass?: string; // - 'datetimeclass' -> date/time pickers, 'datetimeclass dark -> date/time pickers dark
+    isIconInput?: boolean; // display icon instead of regular input
+    isValidIcon?: boolean; // display icon instead of regular input
+    inputIcon?: string; // display icon instead of regular input
+
+    // ***************** Multiple Inputs & Labels *****************
+    multipleInputValues?: {
+        options: IMultipleInput[];
+        customClass: string;
+    };
+    multipleLabel?: {
+        labels: string[]; // ['Driver', 'Truck #', 'Trailer #']
+        searchLabels?: string[];
+        customClass: string;
+    };
+    isInputBackgroundRemoved?: boolean;
+    isBlueText?: boolean;
+
+    // ***************** Input Actions (confirm-cancel buttons) *****************
+    commands?: {
+        active?: boolean;
+        type?: string; // examples:  'increment-decrement', 'confirm-cancel'
+        firstCommand?: {
+            popup?: {
+                name?: string;
+                backgroundColor?: string;
+            };
+            name?: string;
+            svg?: string;
+        };
+        secondCommand?: {
+            popup?: {
+                name?: string;
+                backgroundColor?: string;
+            };
+            name?: string;
+            svg?: string;
+        };
+        thirdCommand?: {
+            popup?: {
+                name?: string;
+                backgroundColor?: string;
+            };
+            name?: string;
+            svg?: string;
+        };
+        setTimeout?: number; // if must keep focus on input
+        blueCommands?: boolean;
+    };
+    defaultValue?: string; // default input value for Reset command
+
+    // ***************** DROPDOWNS *****************
+
+    // Pure Dropdown
+    isDropdown?: boolean;
+    dropdownWidthClass?: string; // Look in ta-input-drodown.scss for implementation class (width of dropdowns)
+    dropdownImageInput?: ICaInputWithDropdown | null;
+    isInvalidSearchInDropdown?: boolean;
+    selectedDropdown?: boolean;
+    mergeDropdownBodyWithInput?: boolean;
+    hideAllItemsInInputDropdown?: boolean;
+    isBlueDropdown?: boolean;
+    isItemSelected?: boolean;
+    isDisplayingCustomPeriodRange?: boolean;
+    isUsingCustomPeriodRange?: boolean;
+
+    // Address Dropdown
+    isDispatchLocationDropdown?: boolean;
+
+    // Label dropdown
+    dropdownLabel?: boolean;
+    dropdownLabelNew?: boolean;
+
+    // MultiSelect Dropdown
+    multiselectDropdown?: boolean;
+    multiSelectDropdownActive?: boolean;
+    multiSelectItemRange?: boolean;
+
+    // DateTime Picker
+    isFromDate?: boolean;
+    hideColorValidations?: boolean; // regular color for inputs, no blue validation
+    expiredDateInvalid?: boolean; // accept only dates that didn't expire
+    isFutureDateDisabled?: boolean; // disabled future dates
+    fixedPlacholder?: string;
+    statusStyle?: boolean;
+    isIconHidden?: boolean;
+    isRemovedIconMovedOnLeft?: boolean;
+    removeLeadingZero?: boolean;
+    negativeLeadingZero?: boolean;
+    isHoverRow?: boolean;
+    minutesGapFive?: boolean;
+
+    updateAsTouchedOnEdit?: boolean;
+    transparentInput?: boolean;
+    preventTyping?: boolean;
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/config/index.ts

@@ -0,0 +1 @@
+export * from './cai-input.config';

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/enums/calendar-left-string.enum.ts

@@ -0,0 +1,5 @@
+export enum CalendarLeftStringEnum {
+    FULL_SIZE = 22,
+    CYCLE_HEIGHT = 100 * (12 * FULL_SIZE) + 265,
+    CYCLE_HEIGHT_BY_MONTHS = 100 * FULL_SIZE + 265,
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/enums/calendar-list-preview-string.enum.ts

@@ -0,0 +1,4 @@
+export enum CalendarListPreviewStringEnum {
+  FULL_LIST = 'full_list',
+  MONTH_LIST = 'month_list',
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/enums/calendar-main-string.enum.ts

@@ -0,0 +1,5 @@
+export enum CalendarMainStringEnum {
+    FULL_SIZE = 182,
+    CYCLE_HEIGHT = 100 * (12 * FULL_SIZE) + 50,
+    CYCLE_HEIGHT_BY_MONTHS = 100 * FULL_SIZE + 65,
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/enums/calendar-scroll-type-string.enum.ts

@@ -0,0 +1,4 @@
+export enum CalendarScrollTypeStringEnum {
+  HOURS_SCROLL = 'hourScroll',
+  PM_AM_SCROLL = 'pmAmScroll',
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/enums/calendar-string.enum.ts

@@ -0,0 +1,6 @@
+export enum CalendarStringEnum {
+  AUTO = 'auto',
+  LEFT = 'left',
+  LIST_PREVIEW = 'listPreview',
+  MAIN = 'main'
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/enums/calendar-type-string.enum.ts

@@ -0,0 +1,3 @@
+export enum CalendarTypeStringEnum {
+  TIME = 'time',
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/enums/config.enum.ts

@@ -0,0 +1,7 @@
+export enum InputConfigNameStringEnum {
+    DATE_PICKER = 'datepicker',
+    TIME_PICKER = 'timepicker',
+    DATE_PICKER_BANK_CARD = 'datepickerBankCard',
+    INPUT_DROPDOWN_BANK_NAME = 'Input Dropdown Bank Name',
+    ADDRESS = 'Address'
+  }  

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/models/scroll-change.model.ts

@@ -0,0 +1,6 @@
+export interface ScrollChange {
+  indx: number;
+  scrollOffset: number;
+  cycleSize: number;
+  type: string;
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/models/scroll-type.model.ts

@@ -0,0 +1,8 @@
+export interface ScrollType {
+  pmAmScroll: number;
+  minutesScroll: number;
+  hourScroll: number;
+  monthScroll: number;
+  dayScroll: number;
+  yearScroll: number;
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/pipes/calendar-months.pipe.ts

@@ -0,0 +1,23 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { CustomDatetimePickersConstants } from '../utils/constants/custom-datetime-pickers.constants';
+import { CalendarListPreviewStringEnum } from '../enums/calendar-list-preview-string.enum';
+
+@Pipe({
+    name: 'calendarmonths',
+    standalone: true,
+})
+export class CalendarMonthsPipe implements PipeTransform {
+    private MONTHS = CustomDatetimePickersConstants.monthNames;
+
+    constructor() {}
+
+    transform(index: Date, listPreview: string): string {
+        if (
+            this.MONTHS[index.getMonth()] === 'January' ||
+            listPreview === CalendarListPreviewStringEnum.MONTH_LIST
+        )
+            return `<span class="left-year-show">${index.getFullYear()}</span>`;
+
+        return this.MONTHS[index.getMonth()].slice(0, 3);
+    }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/services/calendar-datetime-picker.service.ts

@@ -0,0 +1,35 @@
+import { distinctUntilChanged } from "rxjs/operators";
+import { Subject } from "rxjs";
+import { Injectable } from "@angular/core";
+
+// models
+import { ScrollChange } from "../models/scroll-change.model";
+
+@Injectable({
+  providedIn: "root",
+})
+export class CalendarDateTimePickerService {
+  public index$ = new Subject<ScrollChange>();
+  public indexAuto$ = new Subject<number>();
+  public scrollToDate = new Subject<string>();
+  public dateChanged = new Subject<any>();
+  public selectedIndex = 0;
+  scrolledIndexChange = this.index$.pipe(distinctUntilChanged());
+  scrollToAutoIndex = this.indexAuto$.pipe(distinctUntilChanged());
+  private scrolledScroll!: string;
+
+  constructor() {}
+
+  public set setAutoIndex(number: number) {
+    this.selectedIndex = number;
+    this.indexAuto$.next(number);
+  }
+
+  public set scrolledScrollItem(name: string) {
+    this.scrolledScroll = name;
+  }
+
+  public get selectedScroll() {
+    return this.scrolledScroll;
+  }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/strategy/calendar-strategy.ts

@@ -0,0 +1,120 @@
+import {
+  CdkVirtualScrollViewport,
+  VirtualScrollStrategy,
+} from '@angular/cdk/scrolling';
+import { Inject, Injectable } from '@angular/core';
+import { Subject } from 'rxjs';
+import { distinctUntilChanged } from 'rxjs/operators';
+
+// services
+import { CalendarDateTimePickerService } from '../services/calendar-datetime-picker.service';
+
+export const STARTING_YEAR = new Date().getFullYear() - 90;
+
+export const RANGE = 100 * 12;
+
+const BUFFER = 500;
+
+@Injectable()
+export class CalendarStrategy implements VirtualScrollStrategy {
+  constructor(
+    private calendarService: CalendarDateTimePickerService,
+    @Inject(String) private startedHeight: number,
+    @Inject(String) private FULL_SIZE: number,
+    @Inject(String) private SCROLL_TYPE: string
+  ) {}
+
+  private index$ = new Subject<any>();
+  scrolledIndexChange = this.index$.pipe(distinctUntilChanged());
+  private viewport?: CdkVirtualScrollViewport;
+
+  public attach(viewport: CdkVirtualScrollViewport): void {
+    this.viewport = viewport;
+    this.viewport.setTotalContentSize(this.startedHeight);
+    this.updateRenderedRange(this.viewport);
+  }
+
+  public updateScrollHeights(height: number): void {
+    this.viewport?.setTotalContentSize(height);
+    this.updateRenderedRange(this.viewport);
+  }
+
+  public detach(): void {
+    this.index$.complete();
+    this.viewport = undefined;
+  }
+
+  public onContentScrolled(): void {
+    if (this.viewport) this.updateRenderedRange(this.viewport);
+  }
+
+  /** These do not matter for this case */
+  public onDataLengthChanged(): void {}
+
+  public onContentRendered(): void {}
+
+  public onRenderedOffsetChanged(): void {}
+
+  public scrollToIndex(index: number, behavior: ScrollBehavior): void {
+    if (this.viewport)
+      this.viewport.scrollToOffset(this.getOffsetForIndex(index), behavior);
+  }
+
+  public scrollToOffset(offset: number, behavior: ScrollBehavior): void {
+    if (this.viewport) this.viewport.scrollToOffset(offset, behavior);
+  }
+
+  public getOffsetForIndex(index: number): number {
+    return this.FULL_SIZE * index;
+  }
+
+  private getIndexForOffset(offset: number): number {
+    return Math.round(offset / this.FULL_SIZE);
+  }
+  private updateRenderedRange(viewport?: CdkVirtualScrollViewport): void {
+    if (!viewport) return;
+
+    const offset = viewport.measureScrollOffset();
+
+    const { start, end } = viewport.getRenderedRange();
+    const viewportSize = 230;
+
+    const dataLength = viewport.getDataLength();
+
+    const newRange = { start, end };
+    const firstVisibleIndex = this.getIndexForOffset(offset);
+
+    const startOffsetIndex = this.FULL_SIZE * start;
+
+    const startBuffer = offset - startOffsetIndex;
+    if (startBuffer < BUFFER && start !== 0) {
+      newRange.start = Math.max(0, this.getIndexForOffset(offset - BUFFER * 2));
+      newRange.end = Math.min(
+        dataLength,
+        this.getIndexForOffset(offset + viewportSize + BUFFER)
+      );
+    } else {
+      const endBuffer = this.FULL_SIZE * end - offset - viewportSize;
+
+      if (endBuffer < BUFFER && end !== dataLength) {
+        newRange.start = Math.max(0, this.getIndexForOffset(offset - BUFFER));
+        newRange.end = Math.min(
+          dataLength,
+          this.getIndexForOffset(offset + viewportSize + BUFFER * 2)
+        );
+      }
+    }
+
+    viewport.setRenderedRange(newRange);
+    viewport.setRenderedContentOffset(this.getOffsetForIndex(newRange.start));
+
+    // Used for update of 2nd scroll that is listening
+    if (this.calendarService.selectedScroll === this.SCROLL_TYPE)
+      this.index$.next({
+        indx: firstVisibleIndex,
+        scrollOffset: offset,
+        cycleSize: this.FULL_SIZE,
+        type: this.SCROLL_TYPE,
+      });
+  }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/components/cai-custom-datetime-pickers/utils/constants/custom-datetime-pickers.constants.ts

@@ -0,0 +1,48 @@
+export class CustomDatetimePickersConstants {
+  public static readonly timeMinutes = ['00', '15', '30', '45'];
+  public static readonly timeMinutesGapFive = [
+    '00',
+    '05',
+    '10',
+    '15',
+    '20',
+    '25',
+    '30',
+    '35',
+    '40',
+    '45',
+    '50',
+    '55',
+  ];
+  public static readonly monthNames = [
+    'January',
+    'February',
+    'March',
+    'April',
+    'May',
+    'June',
+    'July',
+    'August',
+    'September',
+    'October',
+    'November',
+    'December',
+  ];
+  public static readonly hourTimes = [
+    12, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10,
+    11,
+  ];
+  public static readonly defaultScrollTypes = {
+    pmAmScroll: 0,
+    minutesScroll: 0,
+    hourScroll: 8,
+    monthScroll: 0,
+    dayScroll: 0,
+    yearScroll: 0,
+  };
+  public static readonly timeOfDay = ['AM', 'PM'];
+  public static readonly defaultSelectedTime = '12:00 AM';
+  public static readonly defaultOutputTypeTime = ['hh', ':', 'mm', ' ', 'AM'];
+  public static readonly defaultOutputTypeDate = ['MM', '/', 'DD', '/', 'YY'];
+  public static readonly dayOfWeekLetters = ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/enums/input-config-name-string.enum.ts

@@ -0,0 +1,7 @@
+export enum InputConfigNameStringEnum {
+  DATE_PICKER = 'datepicker',
+  TIME_PICKER = 'timepicker',
+  DATE_PICKER_BANK_CARD = 'datepickerBankCard',
+  INPUT_DROPDOWN_BANK_NAME = 'Input Dropdown Bank Name',
+  ADDRESS = 'Address'
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/interfaces/index.ts

@@ -0,0 +1 @@
+export * from './input-datetime.interface';

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/interfaces/input-datetime.interface.ts

@@ -0,0 +1,11 @@
+import { CustomError } from '../../input/models';
+import { ICaInput } from '../components/cai-custom-datetime-pickers/config';
+
+export interface CaiDateTimeConfig extends ICaInput {
+  inTable?: boolean;
+  isBilling?: boolean;
+  inverse?: boolean;
+  hasStroke?: boolean;
+  size?: number;
+  customErrors?: CustomError[];
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/models/index.ts

@@ -0,0 +1,5 @@
+export interface OptionModel {
+    value: any;
+    label: string;
+    [key: string]: any;
+}