@coreui/angular-pro 4.0.2 → 4.1.0-next.2

package/lib/date-range-picker/date-range-picker/date-range-picker.component.d.ts

@@ -0,0 +1,233 @@
+import { ElementRef, EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { ControlValueAccessor, FormControl, FormGroup } from '@angular/forms';
+import { BooleanInput } from '@angular/cdk/coercion';
+import { BreakpointObserver } from '@angular/cdk/layout';
+import { Colors } from '../../coreui.types';
+import { CalendarComponent } from '../../calendar';
+import { DateFilterType, DayFormatType, WeekdayFormatType } from '../../calendar/calendar.service';
+import { StartDateDirective } from '../start-date.directive';
+import { EndDateDirective } from '../end-date.directive';
+import * as i0 from "@angular/core";
+export interface ICalendarRange {
+    [key: string]: Date[];
+}
+export declare type TCustomRange = [string, Date[]];
+/** Must be a valid date string */
+export declare class DateRangePickerComponent implements OnInit, OnDestroy, ControlValueAccessor {
+    private breakpointObserver;
+    static ngAcceptInputType_disabled: BooleanInput;
+    static ngAcceptInputType_navYearFirst: BooleanInput;
+    constructor(breakpointObserver: BreakpointObserver);
+    /**
+     * Set the format of day name.
+     * @default 'numeric'
+     * @type DayFormatType
+     */
+    dayFormat: DayFormatType;
+    /**
+     * The number of calendars that render on desktop devices.
+     * @type number
+     * @default 2
+     */
+    set calendars(value: number);
+    get calendars(): number;
+    private _calendars;
+    /**
+     * Toggle visibility or set the content of the cleaner button.
+     * @type boolean
+     * @default true
+     */
+    set cleaner(value: boolean);
+    get cleaner(): boolean;
+    private _cleaner;
+    /**
+     * Set date format.
+     * We use date-fns to format dates. Visit https://date-fns.org/v2.28.0/docs/format to check accepted patterns.
+     */
+    format?: string;
+    /**
+     * Toggle visibility or set the content of the input indicator.
+     * @type boolean
+     * @default true
+     */
+    set indicator(value: boolean);
+    get indicator(): boolean;
+    private _indicator;
+    /**
+     * Toggle the readonly state for the component.
+     * @type boolean
+     * @default false
+     */
+    set inputReadOnly(value: boolean);
+    get inputReadOnly(): boolean;
+    private _inputReadOnly;
+    /**
+     * Reorder year-month navigation, and render year first.
+     * @type boolean
+     * @default false
+     */
+    set navYearFirst(value: boolean);
+    get navYearFirst(): boolean;
+    private _navYearFirst;
+    /**
+     * Specifies short hints that are visible in start date and end date inputs.
+     * type string
+     */
+    placeholder: string | string[];
+    /**
+     * Predefined date ranges the user can select from.
+     * @type ICalendarRange
+     */
+    ranges?: object;
+    /**
+     * Sets the color context of the cancel button to one of CoreUI’s themed colors.
+     * @type 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | string
+     * @default 'secondary'
+     */
+    rangesButtonsColor?: Colors;
+    /**
+     * Size the ranges button small or large.
+     * @type 'sm' | 'lg' | undefined
+     */
+    rangesButtonsSize?: 'sm' | 'lg';
+    /**
+     * Set the ranges button variant to an outlined button or a ghost button.
+     * @type 'outline' | 'ghost' | undefined
+     */
+    rangesButtonsVariant?: 'outline' | 'ghost';
+    /**
+     * Default icon or character that separates two dates.
+     * @type boolean
+     * @default true
+     */
+    set separator(value: boolean);
+    get separator(): boolean;
+    private _separator;
+    /**
+     * Size the component small or large.
+     * @type 'sm' | 'lg' | undefined
+     * @default undefined
+     */
+    size?: 'sm' | 'lg';
+    /**
+     * Provide an additional time selection by adding select boxes to choose time.
+     * @type boolean
+     * @default false
+     */
+    set timepicker(value: boolean);
+    get timepicker(): boolean;
+    private _timepicker;
+    /**
+     * Toggle visibility or set the content of today button.
+     * @type string
+     * @default 'Today'
+     */
+    todayButton: string;
+    /**
+     * Sets the color context of the today button to one of CoreUI’s themed colors.
+     * @type 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | string
+     * @default 'primary'
+     */
+    todayButtonColor: Colors;
+    /**
+     * Size the today button small or large.
+     * @type 'sm' | 'lg'
+     * @default 'sm'
+     */
+    todayButtonSize: 'sm' | 'lg';
+    /**
+     * Set the today button variant to an outlined button or a ghost button.
+     * @type 'outline' | 'ghost' | undefined
+     */
+    todayButtonVariant?: 'outline' | 'ghost';
+    /**
+     * Toggle the visibility of the component.
+     * @type boolean
+     * @default false
+     */
+    set visible(value: boolean);
+    get visible(): boolean;
+    private _visible;
+    startDate?: Date | null;
+    endDate?: Date | null;
+    calendarDate?: Date;
+    disabledDates: Date[] | Date[][];
+    set firstDayOfWeek(value: number);
+    get firstDayOfWeek(): number;
+    private _firstDayOfWeek;
+    locale: string;
+    maxDate: Date | null;
+    minDate: Date | null;
+    set navigation(value: boolean);
+    get navigation(): boolean;
+    private _navigation;
+    /**
+     * Allow range selection.
+     * @type boolean
+     * @default false
+     */
+    set range(value: boolean);
+    get range(): boolean;
+    private _range;
+    dateFilter?: DateFilterType;
+    set disabled(value: boolean);
+    get disabled(): boolean;
+    private _disabled;
+    set value(value: Date[]);
+    get value(): Date[];
+    private _value;
+    /**
+     * Set length or format of day name.
+     * @type WeekdayFormatType
+     * @default 'short'
+     */
+    weekdayFormat: WeekdayFormatType;
+    readonly valueChange: EventEmitter<Date | Date[] | undefined>;
+    calendarCellHover: EventEmitter<Date | null>;
+    calendarDateChange: EventEmitter<Date>;
+    endDateChange: EventEmitter<Date | null>;
+    startDateChange: EventEmitter<Date | null>;
+    calendarComponent: CalendarComponent;
+    startDateDirective: StartDateDirective;
+    endDateDirective: EndDateDirective;
+    isMobile: boolean;
+    customRanges: TCustomRange[];
+    set startDateValue(value: string);
+    get startDateValue(): string;
+    private _startDateValue;
+    set endDateValue(value: string);
+    get endDateValue(): string;
+    _endDateValue: string;
+    startDatePlaceholder: string;
+    endDatePlaceholder: string;
+    private layoutChanges;
+    startDateInput: FormControl;
+    endDateInput: FormControl;
+    dateRangeGroup: FormGroup;
+    set inputStartHoverValue(value: Date | null);
+    get inputStartHoverValue(): Date | null;
+    private _inputStartHoverValue;
+    set inputEndHoverValue(value: Date | null);
+    get inputEndHoverValue(): Date | null;
+    private _inputEndHoverValue;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    getCustomRangeKey(customRange: any): any;
+    setCustomRange(customRange: any): void;
+    handleCalendarCellHover($event: Date | null): void;
+    handleCalendarDateChange($event: Date): void;
+    handleStartDateChange(date: Date | null): void;
+    handleEndDateChange(date: Date | null): void;
+    handleClear($event: MouseEvent): void;
+    handleStartDateInputChange($event: any): void;
+    handleEndDateInputChange($event: any): void;
+    forbiddenDate(date: Date): boolean | undefined;
+    setInputValue: (elementRef: ElementRef, date: Date | null) => void;
+    onChange: any;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    writeValue(value: (Date[])): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateRangePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DateRangePickerComponent, "c-date-range-picker", ["cDateRangePicker"], { "dayFormat": "dayFormat"; "calendars": "calendars"; "cleaner": "cleaner"; "format": "format"; "indicator": "indicator"; "inputReadOnly": "inputReadOnly"; "navYearFirst": "navYearFirst"; "placeholder": "placeholder"; "ranges": "ranges"; "rangesButtonsColor": "rangesButtonsColor"; "rangesButtonsSize": "rangesButtonsSize"; "rangesButtonsVariant": "rangesButtonsVariant"; "separator": "separator"; "size": "size"; "timepicker": "timepicker"; "todayButton": "todayButton"; "todayButtonColor": "todayButtonColor"; "todayButtonSize": "todayButtonSize"; "todayButtonVariant": "todayButtonVariant"; "visible": "visible"; "startDate": "startDate"; "endDate": "endDate"; "calendarDate": "calendarDate"; "disabledDates": "disabledDates"; "firstDayOfWeek": "firstDayOfWeek"; "locale": "locale"; "maxDate": "maxDate"; "minDate": "minDate"; "navigation": "navigation"; "range": "range"; "dateFilter": "dateFilter"; "disabled": "disabled"; "value": "value"; "weekdayFormat": "weekdayFormat"; }, { "valueChange": "valueChange"; "calendarCellHover": "calendarCellHover"; "calendarDateChange": "calendarDateChange"; "endDateChange": "endDateChange"; "startDateChange": "startDateChange"; }, never, ["*"]>;
+}

package/lib/date-range-picker/date-range-picker.module.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./date-range-picker/date-range-picker.component";
+import * as i2 from "./start-date.directive";
+import * as i3 from "./end-date.directive";
+import * as i4 from "@angular/common";
+import * as i5 from "@angular/forms";
+import * as i6 from "../button/button.module";
+import * as i7 from "../calendar/calendar.module";
+import * as i8 from "../shared/shared.module";
+import * as i9 from "../form/form.module";
+import * as i10 from "../dropdown/dropdown.module";
+export declare class DateRangePickerModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateRangePickerModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DateRangePickerModule, [typeof i1.DateRangePickerComponent, typeof i2.StartDateDirective, typeof i3.EndDateDirective], [typeof i4.CommonModule, typeof i5.FormsModule, typeof i5.ReactiveFormsModule, typeof i6.ButtonModule, typeof i7.CalendarModule, typeof i8.SharedModule, typeof i9.FormModule, typeof i10.DropdownModule], [typeof i1.DateRangePickerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<DateRangePickerModule>;
+}

package/lib/date-range-picker/end-date.directive.d.ts

@@ -0,0 +1,8 @@
+import { ElementRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class EndDateDirective {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<EndDateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<EndDateDirective, "[cEndDate]", ["cEndDate"], {}, {}, never>;
+}

package/lib/date-range-picker/index.d.ts

@@ -0,0 +1 @@
+export * from './public_api';

package/lib/date-range-picker/public_api.d.ts

@@ -0,0 +1,2 @@
+export { DateRangePickerComponent, ICalendarRange } from './date-range-picker/date-range-picker.component';
+export { DateRangePickerModule } from './date-range-picker.module';

package/lib/date-range-picker/start-date.directive.d.ts

@@ -0,0 +1,8 @@
+import { ElementRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class StartDateDirective {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<StartDateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<StartDateDirective, "[cStartDate]", ["cStartDate"], {}, {}, never>;
+}

package/lib/smart-table/smart-table/smart-table.component.d.ts

@@ -1,11 +1,12 @@
-import { AfterContentInit, EventEmitter, IterableDiffers, QueryList, TemplateRef } from '@angular/core';
+import { AfterContentInit, EventEmitter, IterableDiffers, KeyValueDiffers, OnChanges, QueryList, SimpleChanges, TemplateRef } from '@angular/core';
 import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
 import { ITable } from '../../table/table.type';
 import { IColumnFilter, IColumnFilterValue, IItem, IItemInternal, ISmartTable, ISorter, ISorterValue, ITableFilter, ITableGroupProps, ItemsPerPageSelect } from '../smart-table.type';
 import { TemplateIdDirective } from '../../shared';
 import * as i0 from "@angular/core";
-export declare class SmartTableComponent implements ISmartTable, AfterContentInit {
-    private iterable;
+export declare class SmartTableComponent implements ISmartTable, AfterContentInit, OnChanges {
+    private iterableDiffers;
+    private keyValueDiffers;
     static ngAcceptInputType_activePage: NumberInput;
     static ngAcceptInputType_cleaner: BooleanInput;
     static ngAcceptInputType_clickableRows: BooleanInput;
@@ -14,8 +15,9 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     static ngAcceptInputType_itemsPerPage: NumberInput;
     static ngAcceptInputType_pagination: BooleanInput;
     static ngAcceptInputType_selectable: BooleanInput;
-    constructor(iterable: IterableDiffers);
+    constructor(iterableDiffers: IterableDiffers, keyValueDiffers: KeyValueDiffers);
     private iterableDiffer;
+    private columFilterValueDiffer;
     set activePage(value: number);
     get activePage(): number;
     private _activePage;
@@ -108,7 +110,7 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     handleSorterChange(column: string, index: number): void;
     setActivePage($event: number): void;
     handleColumnFilterChange($event: any): void;
-    handleTableFilterChange($event: string): void;
+    handleTableFilterChange($event: any): void;
     clean($event: MouseEvent): void;
     handleItemsPerPageChange(value: number): void;
     handleRowChecked($event: Event, item: IItemInternal): void;
@@ -125,6 +127,7 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
         item: IItemInternal;
         i: number;
     }): void;
+    ngOnChanges(changes: SimpleChanges): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SmartTableComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SmartTableComponent, "c-smart-table", ["cSmartTable"], { "activePage": "activePage"; "cleaner": "cleaner"; "clickableRows": "clickableRows"; "columns": "columns"; "columnFilter": "columnFilter"; "columnFilterValue": "columnFilterValue"; "columnSorter": "columnSorter"; "footer": "footer"; "header": "header"; "items": "items"; "itemsPerPage": "itemsPerPage"; "itemsPerPageLabel": "itemsPerPageLabel"; "itemsPerPageOptions": "itemsPerPageOptions"; "itemsPerPageSelect": "itemsPerPageSelect"; "loading": "loading"; "noItemsLabel": "noItemsLabel"; "pagination": "pagination"; "selectable": "selectable"; "sorterValue": "sorterValue"; "tableFilter": "tableFilter"; "tableFilterLabel": "tableFilterLabel"; "tableFilterPlaceholder": "tableFilterPlaceholder"; "tableFilterValue": "tableFilterValue"; "tableBodyProps": "tableBodyProps"; "tableFootProps": "tableFootProps"; "tableHeadProps": "tableHeadProps"; "tableProps": "tableProps"; }, { "selectedItemsChange": "selectedItemsChange"; "sorterValueChange": "sorterValueChange"; "activePageChange": "activePageChange"; "itemsPerPageChange": "itemsPerPageChange"; "rowClick": "rowClick"; "columnFilterValueChange": "columnFilterValueChange"; "filteredItemsChange": "filteredItemsChange"; "tableFilterValueChange": "tableFilterValueChange"; }, ["columnTemplates"], never>;
 }

package/lib/smart-table/smart-table-filter/smart-table-filter.component.d.ts

@@ -6,10 +6,11 @@ export declare class SmartTableFilterComponent {
     filterPlaceholder: string;
     set value(value: string);
     get value(): string;
+    valueChange: EventEmitter<any>;
     private _value;
-    valueChange: EventEmitter<string>;
+    private eventType;
     get hostClasses(): any;
-    onKey($event: KeyboardEvent): void;
+    handleTableFilterChange($event: Event): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SmartTableFilterComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SmartTableFilterComponent, "c-smart-table-filter", never, { "filterLabel": "filterLabel"; "filterPlaceholder": "filterPlaceholder"; "value": "value"; }, { "valueChange": "valueChange"; }, never, never>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/angular-pro",
-  "version": "4.0.2",
+  "version": "4.1.0-next.2",
   "description": "CoreUI Pro Components Library for Angular",
   "homepage": "https://coreui.io/angular",
   "author": {
@@ -17,6 +17,7 @@
   ],
   "dependencies": {
     "@popperjs/core": "~2.11.5",
+    "date-fns": "^2.28.0",
     "tslib": "^2.3.0"
   },
   "peerDependencies": {

package/public-api.d.ts

@@ -7,10 +7,12 @@ export * from './lib/badge';
 export * from './lib/breadcrumb';
 export * from './lib/button';
 export * from './lib/button-group';
+export * from './lib/calendar';
 export * from './lib/callout';
 export * from './lib/card';
 export * from './lib/carousel';
 export * from './lib/collapse';
+export * from './lib/date-range-picker';
 export * from './lib/dropdown';
 export * from './lib/element-cover';
 export * from './lib/footer';