angular-multiselect3 10.0.0

package/lib/multiselect.component.d.ts

@@ -0,0 +1,134 @@
+import { OnInit, OnDestroy, SimpleChanges, OnChanges, ChangeDetectorRef, AfterViewChecked, EventEmitter, ElementRef } from '@angular/core';
+import { ControlValueAccessor, Validator, UntypedFormControl } from '@angular/forms';
+import { DropdownSettings } from './multiselect.interface';
+import { ListFilterPipe } from './list-filter';
+import { Item, Badge, Search } from './menu-item';
+import { Subscription, Subject } from 'rxjs';
+import * as i0 from "@angular/core";
+import * as i1 from "./clickOutside";
+import * as i2 from "./list-filter";
+import * as i3 from "./menu-item";
+import * as i4 from "@angular/common";
+import * as i5 from "@angular/forms";
+import * as i6 from "./virtual-scroll/virtual-scroll";
+export declare const DROPDOWN_CONTROL_VALUE_ACCESSOR: any;
+export declare const DROPDOWN_CONTROL_VALIDATION: any;
+export declare class AngularMultiSelect implements OnInit, ControlValueAccessor, OnChanges, Validator, AfterViewChecked, OnDestroy {
+    _elementRef: ElementRef;
+    private cdr;
+    private filterPipe;
+    data: Array<any>;
+    settings: DropdownSettings;
+    loading: boolean;
+    onSelect: EventEmitter<any>;
+    onDeSelect: EventEmitter<any>;
+    onSelectAll: EventEmitter<Array<any>>;
+    onDeSelectAll: EventEmitter<Array<any>>;
+    onOpen: EventEmitter<any>;
+    onClose: EventEmitter<any>;
+    onScrollToEnd: EventEmitter<any>;
+    onFilterSelectAll: EventEmitter<Array<any>>;
+    onFilterDeSelectAll: EventEmitter<Array<any>>;
+    onAddFilterNewItem: EventEmitter<any>;
+    onGroupSelect: EventEmitter<any>;
+    onGroupDeSelect: EventEmitter<any>;
+    itemTempl: Item;
+    badgeTempl: Badge;
+    searchTempl: Search;
+    searchInput: ElementRef;
+    selectedListElem: ElementRef;
+    dropdownListElem: ElementRef;
+    cuppaDropdown: ElementRef;
+    onEscapeDown(event: KeyboardEvent): void;
+    onScroll(event: any): void;
+    virtualdata: any;
+    searchTerm$: Subject<string>;
+    selectedItems: Array<any>;
+    isActive: boolean;
+    isSelectAll: boolean;
+    isFilterSelectAll: boolean;
+    isInfiniteFilterSelectAll: boolean;
+    groupedData: Array<any>;
+    filter: any;
+    chunkArray: any[];
+    scrollTop: any;
+    chunkIndex: any[];
+    cachedItems: any[];
+    groupCachedItems: any[];
+    totalRows: any;
+    itemHeight: any;
+    screenItemsLen: any;
+    cachedItemsLen: any;
+    totalHeight: any;
+    scroller: any;
+    maxBuffer: any;
+    lastScrolled: any;
+    lastRepaintY: any;
+    selectedListHeight: any;
+    filterLength: any;
+    infiniteFilterLength: any;
+    viewPortItems: any;
+    item: any;
+    dropdownListYOffset: number;
+    subscription: Subscription;
+    dropDownWidth: number;
+    dropDownTop: any;
+    dropDownBottom: any;
+    dropDownLeft: number;
+    id: any;
+    defaultSettings: DropdownSettings;
+    randomSize: boolean;
+    parseError: boolean;
+    filteredList: any;
+    virtualScroollInit: boolean;
+    private virtualScroller;
+    isDisabledItemPresent: boolean;
+    constructor(_elementRef: ElementRef, cdr: ChangeDetectorRef, filterPipe: ListFilterPipe);
+    ngOnInit(): void;
+    onKeyUp(evt: any): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngDoCheck(): void;
+    ngAfterViewInit(): void;
+    ngAfterViewChecked(): void;
+    onItemClick(item: any, index: number, evt: Event): void;
+    validate(c: UntypedFormControl): any;
+    private onTouchedCallback;
+    private onChangeCallback;
+    writeValue(value: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    trackByFn(index: number, item: any): any;
+    isSelected(clickedItem: any): boolean;
+    addSelected(item: any): void;
+    removeSelected(clickedItem: any): void;
+    toggleDropdown(evt: any): void;
+    openDropdown(): void;
+    closeDropdown(): void;
+    closeDropdownOnClickOut(): void;
+    toggleSelectAll(event: any): void;
+    filterGroupedList(): void;
+    toggleFilterSelectAll(): void;
+    toggleInfiniteFilterSelectAll(): void;
+    clearSearch(): void;
+    onFilterChange(data: any): void;
+    cloneArray(arr: any): any;
+    updateGroupInfo(item: any): void;
+    transformData(arr: Array<any>, field: any): Array<any>;
+    filterInfiniteList(evt: any): void;
+    resetInfiniteSearch(): void;
+    onScrollEnd(e: any): void;
+    ngOnDestroy(): void;
+    selectGroup(item: any): void;
+    addFilterNewItem(): void;
+    calculateDropdownDirection(): void;
+    openTowardsTop(value: boolean): void;
+    clearSelection(e?: any): void;
+    filteritems(evt: any): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AngularMultiSelect, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AngularMultiSelect, "angular2-multiselect", never, { "data": { "alias": "data"; "required": false; }; "settings": { "alias": "settings"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; }, { "onSelect": "onSelect"; "onDeSelect": "onDeSelect"; "onSelectAll": "onSelectAll"; "onDeSelectAll": "onDeSelectAll"; "onOpen": "onOpen"; "onClose": "onClose"; "onScrollToEnd": "onScrollToEnd"; "onFilterSelectAll": "onFilterSelectAll"; "onFilterDeSelectAll": "onFilterDeSelectAll"; "onAddFilterNewItem": "onAddFilterNewItem"; "onGroupSelect": "onGroupSelect"; "onGroupDeSelect": "onGroupDeSelect"; }, ["itemTempl", "badgeTempl", "searchTempl"], never, false, never>;
+}
+export declare class AngularMultiSelectModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AngularMultiSelectModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AngularMultiSelectModule, [typeof AngularMultiSelect, typeof i1.ClickOutsideDirective, typeof i1.ScrollDirective, typeof i2.ListFilterPipe, typeof i3.Item, typeof i3.TemplateRenderer, typeof i3.Badge, typeof i3.Search, typeof i3.CIcon], [typeof i4.CommonModule, typeof i5.FormsModule, typeof i6.VirtualScrollerModule], [typeof AngularMultiSelect, typeof i1.ClickOutsideDirective, typeof i1.ScrollDirective, typeof i2.ListFilterPipe, typeof i3.Item, typeof i3.TemplateRenderer, typeof i3.Badge, typeof i3.Search, typeof i3.CIcon]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AngularMultiSelectModule>;
+}

package/lib/multiselect.interface.d.ts

@@ -0,0 +1,34 @@
+export interface DropdownSettings {
+    singleSelection?: boolean;
+    text?: string;
+    enableCheckAll?: boolean;
+    selectAllText?: string;
+    unSelectAllText?: string;
+    filterSelectAllText?: string;
+    filterUnSelectAllText?: string;
+    enableFilterSelectAll?: boolean;
+    enableSearchFilter?: boolean;
+    searchBy?: string[];
+    maxHeight?: number;
+    badgeShowLimit?: number;
+    classes?: string;
+    limitSelection?: number;
+    disabled?: boolean;
+    searchPlaceholderText?: string;
+    groupBy?: string;
+    showCheckbox?: boolean;
+    noDataLabel?: string;
+    searchAutofocus?: boolean;
+    lazyLoading?: boolean;
+    labelKey?: string;
+    primaryKey?: string;
+    position?: string;
+    loading?: boolean;
+    selectGroup?: boolean;
+    addNewItemOnFilter?: boolean;
+    addNewButtonText?: string;
+    escapeToClose?: boolean;
+    autoPosition?: boolean;
+    clearAll?: boolean;
+    tagToBody?: boolean;
+}

package/lib/multiselect.model.d.ts

@@ -0,0 +1,5 @@
+export declare class MyException {
+    status: number;
+    body: any;
+    constructor(status: number, body: any);
+}

package/lib/multiselect.service.d.ts

@@ -0,0 +1,11 @@
+import { Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare class DataService {
+    filteredData: any;
+    private subject;
+    setData(data: any): void;
+    getData(): Observable<any>;
+    getFilteredData(): any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DataService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<DataService>;
+}

package/lib/virtual-scroll/defaultoptions.d.ts

@@ -0,0 +1,11 @@
+export interface VirtualScrollerDefaultOptions {
+    scrollThrottlingTime: number;
+    scrollDebounceTime: number;
+    scrollAnimationTime: number;
+    scrollbarWidth?: number;
+    scrollbarHeight?: number;
+    checkResizeInterval: number;
+    resizeBypassRefreshThreshold: number;
+    modifyOverflowStyleOfParentScroll: boolean;
+    stripedTable: boolean;
+}

package/lib/virtual-scroll/idimension.d.ts

@@ -0,0 +1,12 @@
+export interface IDimensions {
+    itemCount: number;
+    itemsPerWrapGroup: number;
+    wrapGroupsPerPage: number;
+    itemsPerPage: number;
+    pageCount_fractional: number;
+    childWidth: number;
+    childHeight: number;
+    scrollLength: number;
+    viewportLength: number;
+    maxScrollPosition: number;
+}

package/lib/virtual-scroll/ipageinfo.d.ts

@@ -0,0 +1,9 @@
+export interface IPageInfo {
+    startIndex: number;
+    endIndex: number;
+    scrollStartPosition: number;
+    scrollEndPosition: number;
+    startIndexWithBuffer: number;
+    endIndexWithBuffer: number;
+    maxScrollPosition: number;
+}

package/lib/virtual-scroll/iviewport.d.ts

@@ -0,0 +1,5 @@
+import { IPageInfo } from './ipageinfo';
+export interface IViewport extends IPageInfo {
+    padding: number;
+    scrollLength: number;
+}

package/lib/virtual-scroll/virtual-scroll.d.ts

@@ -0,0 +1,132 @@
+import { ElementRef, EventEmitter, NgZone, OnChanges, OnDestroy, OnInit, Renderer2, ChangeDetectorRef } from '@angular/core';
+import { VirtualScrollerDefaultOptions } from './defaultoptions';
+import { IPageInfo } from './ipageinfo';
+import { IViewport } from './iviewport';
+import { WrapGroupDimensions } from './wrapgroupdimensions';
+import { IDimensions } from './idimension';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+export declare function VIRTUAL_SCROLLER_DEFAULT_OPTIONS_FACTORY(): VirtualScrollerDefaultOptions;
+export declare class VirtualScrollerComponent implements OnInit, OnChanges, OnDestroy {
+    protected readonly element: ElementRef;
+    protected readonly renderer: Renderer2;
+    protected readonly zone: NgZone;
+    protected changeDetectorRef: ChangeDetectorRef;
+    viewPortItems: any[];
+    window: Window & typeof globalThis;
+    get viewPortInfo(): IPageInfo;
+    executeRefreshOutsideAngularZone: boolean;
+    protected _enableUnequalChildrenSizes: boolean;
+    get enableUnequalChildrenSizes(): boolean;
+    set enableUnequalChildrenSizes(value: boolean);
+    useMarginInsteadOfTranslate: boolean;
+    modifyOverflowStyleOfParentScroll: boolean;
+    stripedTable: boolean;
+    scrollbarWidth: number;
+    scrollbarHeight: number;
+    childWidth: number;
+    childHeight: number;
+    ssrChildWidth: number;
+    ssrChildHeight: number;
+    ssrViewportWidth: number;
+    ssrViewportHeight: number;
+    protected _bufferAmount: number;
+    get bufferAmount(): number;
+    set bufferAmount(value: number);
+    scrollAnimationTime: number;
+    resizeBypassRefreshThreshold: number;
+    protected _scrollThrottlingTime: number;
+    get scrollThrottlingTime(): number;
+    set scrollThrottlingTime(value: number);
+    protected _scrollDebounceTime: number;
+    get scrollDebounceTime(): number;
+    set scrollDebounceTime(value: number);
+    protected onScroll: () => void;
+    protected updateOnScrollFunction(): void;
+    protected checkScrollElementResizedTimer: number;
+    protected _checkResizeInterval: number;
+    get checkResizeInterval(): number;
+    set checkResizeInterval(value: number);
+    protected _items: any[];
+    get items(): any[];
+    set items(value: any[]);
+    compareItems: (item1: any, item2: any) => boolean;
+    protected _horizontal: boolean;
+    get horizontal(): boolean;
+    set horizontal(value: boolean);
+    protected revertParentOverscroll(): void;
+    protected oldParentScrollOverflow: {
+        x: string;
+        y: string;
+    };
+    protected _parentScroll: Element | Window;
+    get parentScroll(): Element | Window;
+    set parentScroll(value: Element | Window);
+    vsUpdate: EventEmitter<any[]>;
+    vsChange: EventEmitter<IPageInfo>;
+    vsStart: EventEmitter<IPageInfo>;
+    vsEnd: EventEmitter<IPageInfo>;
+    protected contentElementRef: ElementRef;
+    protected invisiblePaddingElementRef: ElementRef;
+    protected headerElementRef: ElementRef;
+    protected containerElementRef: ElementRef;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    ngOnChanges(changes: any): void;
+    ngDoCheck(): void;
+    refresh(): void;
+    invalidateAllCachedMeasurements(): void;
+    invalidateCachedMeasurementForItem(item: any): void;
+    invalidateCachedMeasurementAtIndex(index: number): void;
+    scrollInto(item: any, alignToBeginning?: boolean, additionalOffset?: number, animationMilliseconds?: number, animationCompletedCallback?: () => void): void;
+    scrollToIndex(index: number, alignToBeginning?: boolean, additionalOffset?: number, animationMilliseconds?: number, animationCompletedCallback?: () => void): void;
+    protected scrollToIndex_internal(index: number, alignToBeginning?: boolean, additionalOffset?: number, animationMilliseconds?: number, animationCompletedCallback?: () => void): void;
+    scrollToPosition(scrollPosition: number, animationMilliseconds?: number, animationCompletedCallback?: () => void): void;
+    protected isAngularUniversalSSR: boolean;
+    constructor(element: ElementRef, renderer: Renderer2, zone: NgZone, changeDetectorRef: ChangeDetectorRef, platformId: Object, options: VirtualScrollerDefaultOptions);
+    protected getElementSize(element: HTMLElement): ClientRect;
+    protected previousScrollBoundingRect: ClientRect;
+    protected checkScrollElementResized(): void;
+    protected _invisiblePaddingProperty: any;
+    protected _offsetType: any;
+    protected _scrollType: any;
+    protected _pageOffsetType: any;
+    protected _childScrollDim: any;
+    protected _translateDir: any;
+    protected _marginDir: any;
+    protected updateDirection(): void;
+    protected debounce(func: Function, wait: number): Function;
+    protected throttleTrailing(func: Function, wait: number): Function;
+    protected calculatedScrollbarWidth: number;
+    protected calculatedScrollbarHeight: number;
+    protected padding: number;
+    protected previousViewPort: IViewport;
+    protected currentTween: any;
+    protected cachedItemsLength: number;
+    protected disposeScrollHandler: () => void | undefined;
+    protected disposeResizeHandler: () => void | undefined;
+    protected refresh_internal(itemsArrayModified: boolean, refreshCompletedCallback?: () => void, maxRunTimes?: number): void;
+    protected getScrollElement(): HTMLElement;
+    protected addScrollEventHandlers(): void;
+    protected removeScrollEventHandlers(): void;
+    protected getElementsOffset(): number;
+    protected countItemsPerWrapGroup(): number;
+    protected getScrollStartPosition(): number;
+    protected minMeasuredChildWidth: number;
+    protected minMeasuredChildHeight: number;
+    protected wrapGroupDimensions: WrapGroupDimensions;
+    protected resetWrapGroupDimensions(): void;
+    protected calculateDimensions(): IDimensions;
+    protected cachedPageSize: number;
+    protected previousScrollNumberElements: number;
+    protected calculatePadding(arrayStartIndexWithBuffer: number, dimensions: IDimensions): number;
+    protected calculatePageInfo(scrollPosition: number, dimensions: IDimensions): IPageInfo;
+    protected calculateViewport(): IViewport;
+    static ɵfac: i0.ɵɵFactoryDeclaration<VirtualScrollerComponent, [null, null, null, null, null, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<VirtualScrollerComponent, "virtual-scroller,[virtualScroller]", ["virtualScroller"], { "executeRefreshOutsideAngularZone": { "alias": "executeRefreshOutsideAngularZone"; "required": false; }; "enableUnequalChildrenSizes": { "alias": "enableUnequalChildrenSizes"; "required": false; }; "useMarginInsteadOfTranslate": { "alias": "useMarginInsteadOfTranslate"; "required": false; }; "modifyOverflowStyleOfParentScroll": { "alias": "modifyOverflowStyleOfParentScroll"; "required": false; }; "stripedTable": { "alias": "stripedTable"; "required": false; }; "scrollbarWidth": { "alias": "scrollbarWidth"; "required": false; }; "scrollbarHeight": { "alias": "scrollbarHeight"; "required": false; }; "childWidth": { "alias": "childWidth"; "required": false; }; "childHeight": { "alias": "childHeight"; "required": false; }; "ssrChildWidth": { "alias": "ssrChildWidth"; "required": false; }; "ssrChildHeight": { "alias": "ssrChildHeight"; "required": false; }; "ssrViewportWidth": { "alias": "ssrViewportWidth"; "required": false; }; "ssrViewportHeight": { "alias": "ssrViewportHeight"; "required": false; }; "bufferAmount": { "alias": "bufferAmount"; "required": false; }; "scrollAnimationTime": { "alias": "scrollAnimationTime"; "required": false; }; "resizeBypassRefreshThreshold": { "alias": "resizeBypassRefreshThreshold"; "required": false; }; "scrollThrottlingTime": { "alias": "scrollThrottlingTime"; "required": false; }; "scrollDebounceTime": { "alias": "scrollDebounceTime"; "required": false; }; "checkResizeInterval": { "alias": "checkResizeInterval"; "required": false; }; "items": { "alias": "items"; "required": false; }; "compareItems": { "alias": "compareItems"; "required": false; }; "horizontal": { "alias": "horizontal"; "required": false; }; "parentScroll": { "alias": "parentScroll"; "required": false; }; }, { "vsUpdate": "vsUpdate"; "vsChange": "vsChange"; "vsStart": "vsStart"; "vsEnd": "vsEnd"; }, ["headerElementRef", "containerElementRef"], ["*"], false, never>;
+}
+export declare class VirtualScrollerModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<VirtualScrollerModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<VirtualScrollerModule, [typeof VirtualScrollerComponent], [typeof i1.CommonModule], [typeof VirtualScrollerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<VirtualScrollerModule>;
+}

package/lib/virtual-scroll/wrapgroupdimension.d.ts

@@ -0,0 +1,5 @@
+export interface WrapGroupDimension {
+    childWidth: number;
+    childHeight: number;
+    items: any[];
+}

package/lib/virtual-scroll/wrapgroupdimensions.d.ts

@@ -0,0 +1,7 @@
+import { WrapGroupDimension } from './wrapgroupdimension';
+export interface WrapGroupDimensions {
+    numberOfKnownWrapGroupChildSizes: number;
+    sumOfKnownWrapGroupChildWidths: number;
+    sumOfKnownWrapGroupChildHeights: number;
+    maxChildSizePerWrapGroup: WrapGroupDimension[];
+}

package/package.json

@@ -0,0 +1,37 @@
+{
+  "$schema": "../../node_modules/ng-packagr/package.schema.json",
+  "name": "angular-multiselect3",
+  "version": "10.0.0",
+  "license": "MIT",
+  "author": "Pradeep Terli",
+  "description": "Angular Multiselct dropdown component library for Angular version 11, 10, 9,8,6,4 ",
+  "keywords": [
+    "angular 15 multiselect dropdown"
+  ],
+  "peerDependencies": {},
+  "dependencies": {
+    "@tweenjs/tween.js": "^17.4.0",
+    "tslib": "^2.3.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/CuppaLabs/angular2-multiselect-dropdown"
+  },
+  "bugs": {
+    "url": "https://github.com/CuppaLabs/angular2-multiselect-dropdown/issues"
+  },
+  "module": "fesm2022/angular-multiselect.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/angular-multiselect.mjs",
+      "esm": "./esm2022/angular-multiselect.mjs",
+      "default": "./fesm2022/angular-multiselect.mjs"
+    }
+  },
+  "sideEffects": false
+}

package/public_api.d.ts

@@ -0,0 +1,6 @@
+export { AngularMultiSelect } from './lib/multiselect.component';
+export { ClickOutsideDirective, ScrollDirective } from './lib/clickOutside';
+export { ListFilterPipe } from './lib/list-filter';
+export { Item } from './lib/menu-item';
+export { TemplateRenderer, Badge, Search, CIcon } from './lib/menu-item';
+export { AngularMultiSelectModule } from './lib/multiselect.component';

package/themes/dark.theme.scss

@@ -0,0 +1,113 @@
+
+$base-color: #000000;
+$btn-background: #fff;
+$btn-border: #ccc;
+$btn-text-color: #333;
+$btn-arrow: #333;
+
+
+$token-background: $base-color;
+$token-text-color: #fff;
+$token-remove-color: #fff;
+
+$box-shadow-color: #959595;
+$list-hover-background: #f5f5f5;
+$label-color: #000;
+$selected-background: #e9f4ff;
+
+.c-btn{
+    background: $btn-background;
+    border: 1px solid $btn-border;
+    color: $btn-text-color;
+}
+.selected-list{
+    .c-list{
+        .c-token{
+            background: $token-background;
+            .c-label{
+               color: $token-text-color;
+            }
+            .c-remove {
+                svg {
+                    fill: $token-remove-color;
+                }
+            }
+
+        }
+    }
+    .c-angle-down, .c-angle-up{
+        svg {
+            fill: $btn-arrow;
+        }
+    }
+}
+.dropdown-list{
+    ul{
+        li:hover{
+            background: $list-hover-background;
+        }
+    }
+}
+.arrow-up, .arrow-down {
+  border-bottom: 15px solid #fff;
+}
+
+.arrow-2{
+    border-bottom: 15px solid #ccc;
+}
+.list-area{
+    border: 1px solid #ccc;
+    background: #fff;
+    box-shadow: 0px 1px 5px $box-shadow-color;
+}
+.select-all{
+    border-bottom: 1px solid #ccc;
+}
+.list-filter{
+    border-bottom: 1px solid #ccc;
+    .c-search{
+        svg {
+            fill: #888;
+        }
+    }
+    .c-clear {
+        svg {
+            fill: #888;
+        }
+    }
+}
+
+.pure-checkbox {
+    input[type="checkbox"]:focus + label:before, input[type="checkbox"]:hover + label:before{
+        border-color: $base-color;
+        background-color: #f2f2f2;
+    }
+    input[type="checkbox"] + label{
+        color: $label-color;
+    }
+    input[type="checkbox"] + label:before{
+        color: $base-color;
+        border: 2px solid $base-color;
+    }
+    input[type="checkbox"] + label:after{
+        background-color: $base-color;
+    }
+    input[type="checkbox"]:disabled + label:before{
+        border-color: #cccccc;
+    }
+    input[type="checkbox"]:disabled:checked + label:before{
+        background-color: #cccccc;
+    }
+    input[type="checkbox"] + label:after{
+        border-color: #ffffff;
+    }
+    input[type="radio"]:checked + label:before{
+        background-color: white;
+    }
+    input[type="checkbox"]:checked + label:before{
+        background: $base-color;
+    }
+}
+.selected-item{
+    background: $selected-background;
+}

package/themes/default.theme.css

@@ -0,0 +1,107 @@
+.mat-toolbar {
+  background: #ffffff; }
+
+.c-btn {
+  background: #fff;
+  border: 1px solid #ccc;
+  color: #333; }
+
+.selected-list .c-list .c-token {
+  background: #0079FE; }
+  .selected-list .c-list .c-token .c-label {
+    color: #fff; }
+  .selected-list .c-list .c-token .c-remove svg {
+    fill: #fff; }
+
+.selected-list .c-angle-down svg, .selected-list .c-angle-up svg {
+  fill: #333; }
+
+.dropdown-list ul li:hover {
+  background: #f5f5f5; }
+
+.arrow-up, .arrow-down {
+  border-bottom: 15px solid #fff; }
+
+.arrow-2 {
+  border-bottom: 15px solid #ccc; }
+
+.list-area {
+  border: 1px solid #ccc;
+  background: #fff;
+  box-shadow: 0px 1px 5px #959595; }
+
+.select-all {
+  border-bottom: 1px solid #ccc; }
+
+.list-filter {
+  border-bottom: 1px solid #ccc; }
+  .list-filter .c-search svg {
+    fill: #888; }
+  .list-filter .c-clear svg {
+    fill: #888; }
+
+.pure-checkbox input[type="checkbox"]:focus + label:before, .pure-checkbox input[type="checkbox"]:hover + label:before {
+  border-color: #0079FE;
+  background-color: #f2f2f2; }
+
+.pure-checkbox input[type="checkbox"] + label {
+  color: #000; }
+
+.pure-checkbox input[type="checkbox"] + label:before {
+  color: #0079FE;
+  border: 1px solid #0079FE; }
+
+.pure-checkbox input[type="checkbox"] + label:after {
+  background-color: #0079FE; }
+
+.pure-checkbox input[type="checkbox"]:disabled + label:before {
+  border-color: #cccccc; }
+
+.pure-checkbox input[type="checkbox"]:disabled:checked + label:before {
+  background-color: #cccccc; }
+
+.pure-checkbox input[type="checkbox"] + label:after {
+  border-color: #ffffff; }
+
+.pure-checkbox input[type="radio"]:checked + label:before {
+  background-color: white; }
+
+.pure-checkbox input[type="checkbox"]:checked + label:before {
+  background: #0079FE; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"]:focus + label:before, .single-select-mode .pure-checkbox input[type="checkbox"]:hover + label:before {
+  border-color: #0079FE;
+  background-color: #f2f2f2; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"] + label {
+  color: #000; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"] + label:before {
+  color: transparent !important;
+  border: 0px solid #0079FE; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"] + label:after {
+  background-color: transparent !important; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"]:disabled + label:before {
+  border-color: #cccccc; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"]:disabled:checked + label:before {
+  background-color: #cccccc; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"] + label:after {
+  border-color: #0079FE; }
+
+.single-select-mode .pure-checkbox input[type="radio"]:checked + label:before {
+  background-color: white; }
+
+.single-select-mode .pure-checkbox input[type="checkbox"]:checked + label:before {
+  background: none !important; }
+
+.selected-item {
+  background: #e9f4ff; }
+
+.btn-iceblue {
+  background: #0079FE;
+  border: 1px solid #ccc;
+  color: #fff; }