mis-crystal-design-system 4.0.51 → 17.0.0

package/fesm2015/mis-crystal-design-system-nested-multi-select-dropdown.js

@@ -1,289 +0,0 @@
-import { ConnectionPositionPair, OverlayConfig, Overlay, OverlayModule } from '@angular/cdk/overlay';
-import { TemplatePortal } from '@angular/cdk/portal';
-import { EventEmitter, Component, ElementRef, ViewContainerRef, Input, Output, ViewChild, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { CheckboxModule } from 'mis-crystal-design-system/checkbox';
-import { ButtonModule } from 'mis-crystal-design-system/button';
-
-class NestedMultiSelectDropdownComponent {
-    constructor(eRef, overlay, viewContainerRef) {
-        this.eRef = eRef;
-        this.overlay = overlay;
-        this.viewContainerRef = viewContainerRef;
-        this.searchInput = "";
-        this.isOpen = false;
-        this.localSelectedItems = [];
-        this.localData = [];
-        this.searchData = [];
-        this.selectedCount = 0;
-        this.label = "Select";
-        this.height = "";
-        this.width = "";
-        this.dropdownListHeight = "";
-        this.dropdownListWidth = "";
-        this.dropdownListPosition = "Left";
-        this.searchEnabled = true;
-        this.showSelectedCount = false;
-        this.noDataMessage = "No Data";
-        this.onChange = new EventEmitter();
-        this.isSearchInputFocused = false;
-    }
-    set data(values) {
-        // tslint:disable-next-line:no-shadowed-variable
-        this.localData = values.map(item => {
-            return Object.assign(Object.assign({}, item), { checked: false, children: item.children.map(a => {
-                    return Object.assign(Object.assign({}, a), { checked: false });
-                }) });
-        });
-    }
-    set selectedItems(values) {
-        this.handlerSetLocalSelectedItems(values);
-    }
-    ngOnInit() { }
-    handlerSetLocalSelectedItems(values) {
-        this.localSelectedItems = values;
-    }
-    searchInputFocused(isFocused) {
-        this.isSearchInputFocused = isFocused;
-    }
-    searchInputCanceled(event) {
-        event.stopPropagation();
-        this.searchInput = "";
-        this.isSearchInputFocused = false;
-    }
-    toggleDropdown() {
-        this.isOpen = !this.isOpen;
-        if (this.isOpen) {
-            this.handlerSetLocalSelectedItems(this.localSelectedItems);
-            this.localData = this.formatValues(this.localData);
-        }
-        if (this.isOpen)
-            this.openDropdown(this.popupContainer, this.selectElement.nativeElement);
-        else
-            this.onCancel();
-    }
-    openDropdown(template, origin) {
-        const positionsBottom = [
-            new ConnectionPositionPair({ originX: "start", originY: "bottom" }, { overlayX: "start", overlayY: "top" }, 0, 4),
-            new ConnectionPositionPair({ originX: "end", originY: "bottom" }, { overlayX: "end", overlayY: "top" }, 0, 4)
-        ];
-        const positionsTop = [
-            new ConnectionPositionPair({ originX: "start", originY: "top" }, { overlayX: "start", overlayY: "bottom" }, 0, -4),
-            new ConnectionPositionPair({ originX: "end", originY: "top" }, { overlayX: "end", overlayY: "bottom" }, 0, -4)
-        ];
-        const positionStrategy = this.overlay
-            .position()
-            .flexibleConnectedTo(origin)
-            .withPositions([
-            ...(this.dropdownListPosition === "Right" ? positionsBottom.reverse() : positionsBottom),
-            ...(this.dropdownListPosition === "Right" ? positionsTop.reverse() : positionsTop)
-        ])
-            .withPush(true);
-        const configs = new OverlayConfig({
-            hasBackdrop: true,
-            backdropClass: "cdk-overlay-transparent-backdrop",
-            scrollStrategy: this.overlay.scrollStrategies.reposition(),
-            positionStrategy,
-            width: origin.clientWidth
-        });
-        this.overlayRef = this.overlay.create(configs);
-        if (this.dropdownListWidth)
-            this.overlayRef.updateSize({ width: this.dropdownListWidth });
-        if (this.dropdownListHeight)
-            this.overlayRef.updateSize({ height: this.dropdownListHeight });
-        this.overlayRef.attach(new TemplatePortal(template, this.viewContainerRef));
-        this.overlayRef.backdropClick().subscribe(res => {
-            this.onCancel();
-        });
-    }
-    // tslint:disable-next-line:variable-name
-    filterByValue(array, string) {
-        return array
-            .filter(o => { var _a; return o.label.toLowerCase().includes(string.toLowerCase()) || ((_a = o.children) === null || _a === void 0 ? void 0 : _a.some(g => { var _a; return (_a = g === null || g === void 0 ? void 0 : g.label) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(string.toLowerCase()); })); })
-            .map(v => {
-            var _a;
-            return Object.assign(Object.assign({}, v), { children: (_a = v === null || v === void 0 ? void 0 : v.children) === null || _a === void 0 ? void 0 : _a.filter(l => { var _a; return (_a = l === null || l === void 0 ? void 0 : l.label) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(string.toLowerCase()); }) });
-        });
-    }
-    searchInputOnChange(newValue) {
-        this.searchInput = newValue;
-        if (newValue) {
-            this.searchData = this.filterByValue(this.localData, newValue);
-        }
-        else {
-            this.searchData = [];
-            this.searchInput = "";
-        }
-    }
-    formatValues(array) {
-        const checkedValues = array
-            .filter(a => a.checked)
-            .sort((a, b) => (a.label > b.label ? 1 : b.label > a.label ? -1 : 0));
-        const unCheckedValues = array
-            .filter(a => !a.checked)
-            .sort((a, b) => (a.label > b.label ? 1 : b.label > a.label ? -1 : 0));
-        return [...checkedValues, ...unCheckedValues];
-    }
-    // tslint:disable-next-line:no-shadowed-variable
-    toggleSelectedItems(event, item, cItem) {
-        event.stopPropagation();
-        if (!cItem) {
-            if (item.checked) {
-                this.localData = [
-                    ...this.localData.map(a => {
-                        if (a.value === item.value) {
-                            return Object.assign(Object.assign({}, a), { checked: false, 
-                                // tslint:disable-next-line:no-shadowed-variable
-                                children: item.children.map(a => {
-                                    return Object.assign(Object.assign({}, a), { checked: false });
-                                }) });
-                        }
-                        return a;
-                    })
-                ];
-            }
-            else {
-                this.localData = [
-                    ...this.localData.map(a => {
-                        if (a.value === item.value) {
-                            return Object.assign(Object.assign({}, a), { checked: true, 
-                                // tslint:disable-next-line:no-shadowed-variable
-                                children: item.children.map(a => {
-                                    return Object.assign(Object.assign({}, a), { checked: true });
-                                }) });
-                        }
-                        return a;
-                    })
-                ];
-            }
-        }
-        else {
-            if (cItem.checked) {
-                this.localData = [
-                    ...this.localData.map(a => {
-                        if (a.value === item.value) {
-                            // tslint:disable-next-line:no-shadowed-variable
-                            const children = a === null || a === void 0 ? void 0 : a.children.map(a => {
-                                if ((cItem === null || cItem === void 0 ? void 0 : cItem.value) === (a === null || a === void 0 ? void 0 : a.value)) {
-                                    return Object.assign(Object.assign({}, a), { checked: false });
-                                }
-                                return a;
-                            });
-                            return Object.assign(Object.assign({}, a), { checked: children.every(q => q.checked), 
-                                // tslint:disable-next-line:no-shadowed-variable
-                                children });
-                        }
-                        return a;
-                    })
-                ];
-            }
-            else {
-                this.localData = [
-                    ...this.localData.map(a => {
-                        if (a.value === item.value) {
-                            // tslint:disable-next-line:no-shadowed-variable
-                            const children = a === null || a === void 0 ? void 0 : a.children.map(a => {
-                                if ((cItem === null || cItem === void 0 ? void 0 : cItem.value) === (a === null || a === void 0 ? void 0 : a.value)) {
-                                    return Object.assign(Object.assign({}, a), { checked: true });
-                                }
-                                return a;
-                            });
-                            return Object.assign(Object.assign({}, a), { checked: children.every(q => q.checked), 
-                                // tslint:disable-next-line:no-shadowed-variable
-                                children });
-                        }
-                        return a;
-                    })
-                ];
-            }
-        }
-        if (this.searchEnabled) {
-            this.searchInputOnChange(this.searchInput);
-        }
-    }
-    applyFilters() {
-        let localCount = 0;
-        this.localData.forEach(a => { var _a; return (_a = a === null || a === void 0 ? void 0 : a.children) === null || _a === void 0 ? void 0 : _a.forEach(b => {
-            if (b.checked) {
-                localCount += 1;
-            }
-        }); });
-        this.selectedCount = localCount;
-        const w = this.localData
-            .filter(r => { var _a; return !(!r.checked && !((_a = r === null || r === void 0 ? void 0 : r.children) === null || _a === void 0 ? void 0 : _a.some(f => f === null || f === void 0 ? void 0 : f.checked))); })
-            .map(a => {
-            var _a;
-            return Object.assign(Object.assign({}, a), { children: (_a = a === null || a === void 0 ? void 0 : a.children) === null || _a === void 0 ? void 0 : _a.filter(s => s.checked) });
-        });
-        this.onChange.emit(w);
-        this.onCancel();
-    }
-    onReset() {
-        this.isSearchInputFocused = false;
-        for (let item of this.localData) {
-            for (let child of item.children) {
-                child.checked = false;
-            }
-            item.checked = false;
-        }
-        this.onChange.emit([]);
-        this.isOpen = false;
-        this.searchInput = "";
-    }
-    onCancel() {
-        var _a;
-        this.isSearchInputFocused = false;
-        this.isOpen = false;
-        (_a = this.overlayRef) === null || _a === void 0 ? void 0 : _a.detach();
-        this.searchInput = "";
-    }
-}
-NestedMultiSelectDropdownComponent.decorators = [
-    { type: Component, args: [{
-                selector: "mis-nested-multi-select-dropdown",
-                template: "<div\n  class=\"container\"\n  [ngStyle]=\"{\n    height: height.length > 0 ? height : '',\n    width: width.length > 0 ? width : ''\n  }\"\n>\n  <div\n    class=\"dropdown\"\n    #select\n    tabindex=\"0\"\n    (keyup.enter)=\"toggleDropdown()\"\n    (click)=\"toggleDropdown()\"\n    [ngStyle]=\"{ background: isOpen ? '#E6EBF7' : '' }\"\n  >\n    <div class=\"label\">\n      <p class=\"text\">{{ label }}</p>\n      <p *ngIf=\"showSelectedCount && selectedCount > 0\" class=\"count\">\n        {{ selectedCount }}\n      </p>\n    </div>\n    <svg\n      class=\"handle\"\n      [ngStyle]=\"{ transform: isOpen ? 'rotate(180deg)' : 'rotate(0deg)' }\"\n      width=\"20\"\n      height=\"20\"\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M13.825 7.15845L10 10.9751L6.175 7.15845L5 8.33345L10 13.3334L15 8.33345L13.825 7.15845Z\"\n        fill=\"#181F33\"\n      />\n    </svg>\n  </div>\n</div>\n<ng-template #popupContainer>\n  <div\n    class=\"popup-container\"\n    [ngStyle]=\"{\n      height: dropdownListHeight,\n      width: dropdownListWidth\n    }\"\n    [ngClass]=\"{\n      'position-left': dropdownListPosition === 'Left',\n      'position-right': dropdownListPosition === 'Right'\n    }\"\n  >\n    <div *ngIf=\"searchEnabled\" class=\"search-container\">\n      <svg\n        *ngIf=\"!isSearchInputFocused\"\n        class=\"search-icon\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M4.21508 11.1456C4.21508 7.3179 7.33722 4.21165 11.1926 4.21165C15.048 4.21165 18.1702 7.3179 18.1702 11.1456C18.1702 12.6931 17.6599 14.1226 16.7972 15.2767L15.3685 16.7013C14.2044 17.5668 12.759 18.0796 11.1926 18.0796C7.33722 18.0796 4.21508 14.9734 4.21508 11.1456ZM15.9421 17.7835C14.6021 18.7329 12.9627 19.2913 11.1926 19.2913C6.66977 19.2913 3 15.6461 3 11.1456C3 6.64512 6.66977 3 11.1926 3C15.7155 3 19.3852 6.64512 19.3852 11.1456C19.3852 12.9371 18.8037 14.5931 17.8184 15.9375L19.8361 17.4048C20.6705 17.912 21.7554 18.6543 20.2454 20.215C18.7353 21.7756 18.0099 20.6663 17.4991 19.8364L15.9421 17.7835Z\"\n          fill=\"#6A737D\"\n        />\n      </svg>\n      <input\n        [ngModel]=\"searchInput\"\n        [ngStyle]=\"{\n          paddingLeft: isSearchInputFocused ? '12px' : '45px',\n          border: isSearchInputFocused ? '1px solid #0937B2' : '1px solid #e0e0e0',\n          paddingRight: isSearchInputFocused ? '45px' : '10px'\n        }\"\n        (ngModelChange)=\"searchInputOnChange($event)\"\n        [placeholder]=\"isSearchInputFocused ? '' : 'Search Keyword'\"\n        (focus)=\"searchInputFocused(true)\"\n        class=\"search-input\"\n      />\n      <svg\n        *ngIf=\"isSearchInputFocused\"\n        class=\"cancel-icon\"\n        (click)=\"searchInputCanceled($event)\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M8.87446 7.32144C8.44588 6.89285 7.751 6.89285 7.32242 7.32144C6.89383 7.75002 6.89383 8.4449 7.32242 8.87349L10.4488 11.9999L7.32357 15.1252C6.89498 15.5538 6.89498 16.2486 7.32357 16.6772C7.75215 17.1058 8.44703 17.1058 8.87561 16.6772L12.0009 13.552L15.1261 16.6772C15.5547 17.1058 16.2496 17.1058 16.6781 16.6772C17.1067 16.2486 17.1067 15.5537 16.6781 15.1251L13.5529 11.9999L16.6793 8.87354C17.1079 8.44496 17.1079 7.75008 16.6793 7.3215C16.2507 6.89291 15.5558 6.89291 15.1273 7.3215L12.0009 10.4479L8.87446 7.32144Z\"\n          fill=\"#6A737D\"\n        />\n      </svg>\n    </div>\n    <div class=\"items\">\n      <div\n        tabindex=\"0\"\n        (keyup.enter)=\"toggleSelectedItems($event, item)\"\n        (click)=\"toggleSelectedItems($event, item)\"\n        *ngFor=\"let item of searchInput ? searchData : localData\"\n      >\n        <div class=\"item\">\n          <div class=\"checkbox-container-wrapper\">\n            <div class=\"checkbox-container\">\n              <mis-checkbox [checked]=\"item.checked\"></mis-checkbox>\n            </div>\n            <p class=\"label\">\n              {{ item.label }}\n            </p>\n          </div>\n          <div class=\"icon-container\" *ngIf=\"item.icon\">\n            <img class=\"icon\" [src]=\"item.icon\" alt=\"no img\" />\n          </div>\n        </div>\n        <div *ngIf=\"item?.children?.length > 0\" class=\"items sub\" style=\"padding-right: 0\">\n          <div\n            class=\"item\"\n            tabindex=\"0\"\n            (keyup.enter)=\"toggleSelectedItems($event, item, cItem)\"\n            (click)=\"toggleSelectedItems($event, item, cItem)\"\n            *ngFor=\"let cItem of item?.children\"\n          >\n            <div class=\"checkbox-container-wrapper\">\n              <div class=\"checkbox-container\">\n                <mis-checkbox [checked]=\"cItem.checked\"></mis-checkbox>\n              </div>\n              <p class=\"label\">\n                {{ cItem.label }}\n              </p>\n            </div>\n            <div class=\"icon-container\" *ngIf=\"cItem.icon\">\n              <img class=\"icon\" [src]=\"cItem.icon\" alt=\"no img\" />\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"noData\" *ngIf=\"(searchInput ? searchData : localData).length === 0\">\n        {{ searchInput === \"\" ? noDataMessage : \"No results\" }}\n      </div>\n    </div>\n    <div *ngIf=\"localData.length !== 0\" class=\"actions-container\">\n      <div style=\"width: calc(50% - 4px)\">\n        <mis-button [name]=\"'Reset'\" [type]=\"'Text'\" [width]=\"'100%'\" (click)=\"onReset()\"></mis-button>\n      </div>\n      <div style=\"width: calc(50% - 4px)\">\n        <mis-button [name]=\"'Apply'\" [type]=\"'Solid'\" [width]=\"'100%'\" (click)=\"applyFilters()\"></mis-button>\n      </div>\n    </div>\n  </div>\n</ng-template>\n",
-                styles: ["::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{background:#9aa7b4}.container{position:relative;display:flex;justify-content:center;align-items:center;height:32px;width:256px;flex-wrap:wrap;font-family:Lato,sans-serif}.container .dropdown{height:inherit;border:1px solid #e0e0e0;border-radius:6px;background-color:#fff;cursor:pointer;display:flex;justify-content:space-between;align-items:center;width:100%;padding:0 12px;overflow:hidden}.container .dropdown:focus-visible,.container .dropdown:hover{background-color:#f5f7fc;outline:none}.container .dropdown .label{display:flex;justify-content:flex-start;align-items:center;width:calc(100% - 32px)}.container .dropdown .label,.container .dropdown .label .text{font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.container .dropdown .label .text{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.container .dropdown .label .count{background-color:#e0e0e0;border-radius:50%;padding:2px 7px;margin:0 0 0 8px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;text-align:center;letter-spacing:.2px;color:#181f33}.container .dropdown .handle{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.popup-container{position:absolute;top:4px;width:100%;max-height:340px;padding-bottom:0;border:1px solid #e0e0e0;border-radius:8px;background-color:#fff;box-shadow:0 12px 24px 0 rgba(0,0,0,.12);overflow-x:hidden;display:flex;flex-direction:column;justify-content:space-between;z-index:100}.popup-container::-webkit-scrollbar{width:0;height:0}.popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container .search-container .search-input{height:40px;width:100%;padding:12px;border:1px solid #e0e0e0;box-sizing:border-box;border-radius:8px;outline:none;caret-color:#0937b2;font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:#181f33}.popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container .items{padding:8px 0 8px 8px;overflow-y:scroll;height:100%}.popup-container .items::-webkit-scrollbar{width:5px;height:0}.popup-container .items::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:10px}.popup-container .items .noData{display:flex;justify-content:center;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.popup-container .items .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;padding:8px 12px;border-radius:6px;height:auto}.popup-container .items .item:focus-visible,.popup-container .items .item:hover{background-color:#f5f7fc;outline:none}.popup-container .items .item .checkbox-container-wrapper{display:flex;justify-content:flex-start;align-items:center;width:90%}.popup-container .items .item .checkbox-container-wrapper .checkbox-container{display:block;position:relative;cursor:pointer;font-size:22px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.popup-container .items .item .checkbox-container-wrapper .checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.popup-container .items .item .checkbox-container-wrapper .checkbox-container input:checked~.checkmark:after{display:block}.popup-container .items .item .checkbox-container-wrapper .checkbox-container .checkmark{position:absolute;top:-8px;left:0;height:15px;width:15px;border-radius:4px;background-color:#0079f1;border:1px solid #6a737d}.popup-container .items .item .checkbox-container-wrapper .checkbox-container .checkmark:after{content:\"\";position:absolute;display:none;left:5px;top:2px;width:3px;height:6px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}.popup-container .items .item .checkbox-container-wrapper .label{margin:0 0 0 8px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33;text-overflow:ellipsis;overflow:hidden}.popup-container .items .item .icon-container{width:10%;display:flex;justify-content:flex-end}.popup-container .items .item .icon-container .icon{width:20px;height:20px}.popup-container .actions-container{display:flex;justify-content:space-between;bottom:0;align-items:center;position:-webkit-sticky;position:sticky;padding:16px;background-color:#fff;border-top:1px solid #e0e0e0}.popup-container .actions-container .cancel{cursor:pointer;padding:10px 32px;text-align:center;font-size:16px;line-height:24px;border-radius:8px}.popup-container .actions-container .cancel:hover{background:rgba(9,55,178,.04)}.popup-container .actions-container .apply{cursor:pointer;padding:10px 32px;text-align:center;color:#fff;font-size:16px;line-height:24px;background:#0937b2;border-radius:8px}"]
-            },] }
-];
-NestedMultiSelectDropdownComponent.ctorParameters = () => [
-    { type: ElementRef },
-    { type: Overlay },
-    { type: ViewContainerRef }
-];
-NestedMultiSelectDropdownComponent.propDecorators = {
-    data: [{ type: Input }],
-    label: [{ type: Input }],
-    height: [{ type: Input }],
-    width: [{ type: Input }],
-    dropdownListHeight: [{ type: Input }],
-    dropdownListWidth: [{ type: Input }],
-    dropdownListPosition: [{ type: Input }],
-    searchEnabled: [{ type: Input }],
-    showSelectedCount: [{ type: Input }],
-    noDataMessage: [{ type: Input }],
-    selectedItems: [{ type: Input }],
-    onChange: [{ type: Output }],
-    selectElement: [{ type: ViewChild, args: ["select", { static: false },] }],
-    popupContainer: [{ type: ViewChild, args: ["popupContainer", { static: false },] }]
-};
-
-class NestedMultiSelectDropdownModule {
-    static forRoot() {
-        return { ngModule: NestedMultiSelectDropdownModule, providers: [] };
-    }
-}
-NestedMultiSelectDropdownModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [NestedMultiSelectDropdownComponent],
-                imports: [CommonModule, FormsModule, OverlayModule, CheckboxModule, ButtonModule],
-                exports: [NestedMultiSelectDropdownComponent]
-            },] }
-];
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { NestedMultiSelectDropdownComponent, NestedMultiSelectDropdownModule };
-//# sourceMappingURL=mis-crystal-design-system-nested-multi-select-dropdown.js.map

package/fesm2015/mis-crystal-design-system-nested-multi-select-dropdown.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mis-crystal-design-system-nested-multi-select-dropdown.js","sources":["../../../projects/mis-components/nested-multi-select-dropdown/nested-multi-select-dropdown.component.ts","../../../projects/mis-components/nested-multi-select-dropdown/nested-multi-select-dropdown.module.ts","../../../projects/mis-components/nested-multi-select-dropdown/mis-crystal-design-system-nested-multi-select-dropdown.ts"],"sourcesContent":["import { OverlayRef, Overlay, ConnectionPositionPair, OverlayConfig } from \"@angular/cdk/overlay\";\nimport { TemplatePortal } from \"@angular/cdk/portal\";\nimport { Component, ElementRef, EventEmitter, Input, OnInit, Output, TemplateRef, ViewChild, ViewContainerRef } from \"@angular/core\";\n\n@Component({\n  selector: \"mis-nested-multi-select-dropdown\",\n  templateUrl: \"./nested-multi-select-dropdown.component.html\",\n  styleUrls: [\"./nested-multi-select-dropdown.component.scss\"]\n})\nexport class NestedMultiSelectDropdownComponent implements OnInit {\n  searchInput: string = \"\";\n  isOpen = false;\n  localSelectedItems: NestedMultiSelectDropdownItem[] = [];\n  localData: NestedMultiSelectDropdownItem[] = [];\n  searchData: NestedMultiSelectDropdownItem[] = [];\n  selectedCount: number = 0;\n\n  @Input() set data(values: NestedMultiSelectDropdownItem[]) {\n    // tslint:disable-next-line:no-shadowed-variable\n    this.localData = values.map(item => {\n      return {\n        ...item,\n        checked: false,\n        children: item.children.map(a => {\n          return {\n            ...a,\n            checked: false\n          };\n        })\n      };\n    });\n  }\n  @Input() label: string = \"Select\";\n  @Input() height: string = \"\";\n  @Input() width: string = \"\";\n\n  @Input() dropdownListHeight: string = \"\";\n  @Input() dropdownListWidth: string = \"\";\n  @Input() dropdownListPosition: \"Left\" | \"Right\" = \"Left\";\n\n  @Input() searchEnabled: boolean = true;\n  @Input() showSelectedCount: boolean = false;\n  @Input() noDataMessage: string = \"No Data\";\n  @Input() set selectedItems(values: NestedMultiSelectDropdownItem[]) {\n    this.handlerSetLocalSelectedItems(values);\n  }\n\n  @Output() onChange: EventEmitter<any> = new EventEmitter();\n\n  @ViewChild(\"select\", { static: false }) selectElement: ElementRef;\n  @ViewChild(\"popupContainer\", { static: false }) popupContainer: TemplateRef<Element>;\n  private overlayRef: OverlayRef;\n\n  constructor(private eRef: ElementRef, private overlay: Overlay, private viewContainerRef: ViewContainerRef) {}\n  ngOnInit() {}\n\n  handlerSetLocalSelectedItems(values) {\n    this.localSelectedItems = values;\n  }\n  isSearchInputFocused: boolean = false;\n  searchInputFocused(isFocused: boolean) {\n    this.isSearchInputFocused = isFocused;\n  }\n  searchInputCanceled(event) {\n    event.stopPropagation();\n    this.searchInput = \"\";\n    this.isSearchInputFocused = false;\n  }\n  toggleDropdown() {\n    this.isOpen = !this.isOpen;\n    if (this.isOpen) {\n      this.handlerSetLocalSelectedItems(this.localSelectedItems);\n      this.localData = this.formatValues(this.localData);\n    }\n    if (this.isOpen) this.openDropdown(this.popupContainer, this.selectElement.nativeElement);\n    else this.onCancel();\n  }\n  private openDropdown(template: TemplateRef<Element>, origin: HTMLElement): void {\n    const positionsBottom = [\n      new ConnectionPositionPair({ originX: \"start\", originY: \"bottom\" }, { overlayX: \"start\", overlayY: \"top\" }, 0, 4),\n      new ConnectionPositionPair({ originX: \"end\", originY: \"bottom\" }, { overlayX: \"end\", overlayY: \"top\" }, 0, 4)\n    ];\n    const positionsTop = [\n      new ConnectionPositionPair({ originX: \"start\", originY: \"top\" }, { overlayX: \"start\", overlayY: \"bottom\" }, 0, -4),\n      new ConnectionPositionPair({ originX: \"end\", originY: \"top\" }, { overlayX: \"end\", overlayY: \"bottom\" }, 0, -4)\n    ];\n    const positionStrategy = this.overlay\n      .position()\n      .flexibleConnectedTo(origin)\n      .withPositions([\n        ...(this.dropdownListPosition === \"Right\" ? positionsBottom.reverse() : positionsBottom),\n        ...(this.dropdownListPosition === \"Right\" ? positionsTop.reverse() : positionsTop)\n      ])\n      .withPush(true);\n    const configs = new OverlayConfig({\n      hasBackdrop: true,\n      backdropClass: \"cdk-overlay-transparent-backdrop\",\n      scrollStrategy: this.overlay.scrollStrategies.reposition(),\n      positionStrategy,\n      width: origin.clientWidth\n    });\n    this.overlayRef = this.overlay.create(configs);\n    if (this.dropdownListWidth) this.overlayRef.updateSize({ width: this.dropdownListWidth });\n    if (this.dropdownListHeight) this.overlayRef.updateSize({ height: this.dropdownListHeight });\n    this.overlayRef.attach(new TemplatePortal(template, this.viewContainerRef));\n    this.overlayRef.backdropClick().subscribe(res => {\n      this.onCancel();\n    });\n  }\n  // tslint:disable-next-line:variable-name\n  filterByValue(array: NestedMultiSelectDropdownItem[], string: string) {\n    return array\n      .filter(\n        o => o.label.toLowerCase().includes(string.toLowerCase()) || o.children?.some(g => g?.label?.toLowerCase().includes(string.toLowerCase()))\n      )\n      .map(v => {\n        return {\n          ...v,\n          children: v?.children?.filter(l => l?.label?.toLowerCase().includes(string.toLowerCase()))\n        };\n      });\n  }\n  searchInputOnChange(newValue) {\n    this.searchInput = newValue;\n    if (newValue) {\n      this.searchData = this.filterByValue(this.localData, newValue);\n    } else {\n      this.searchData = [];\n      this.searchInput = \"\";\n    }\n  }\n  formatValues(array: NestedMultiSelectDropdownItem[]) {\n    const checkedValues = array\n      .filter(a => a.checked)\n      .sort((a: NestedMultiSelectDropdownItem, b: NestedMultiSelectDropdownItem) => (a.label > b.label ? 1 : b.label > a.label ? -1 : 0));\n    const unCheckedValues = array\n      .filter(a => !a.checked)\n      .sort((a: NestedMultiSelectDropdownItem, b: NestedMultiSelectDropdownItem) => (a.label > b.label ? 1 : b.label > a.label ? -1 : 0));\n    return [...checkedValues, ...unCheckedValues];\n  }\n  // tslint:disable-next-line:no-shadowed-variable\n  toggleSelectedItems(event, item: NestedMultiSelectDropdownItem, cItem?: any) {\n    event.stopPropagation();\n    if (!cItem) {\n      if (item.checked) {\n        this.localData = [\n          ...this.localData.map(a => {\n            if (a.value === item.value) {\n              return {\n                ...a,\n                checked: false,\n                // tslint:disable-next-line:no-shadowed-variable\n                children: item.children.map(a => {\n                  return {\n                    ...a,\n                    checked: false\n                  };\n                })\n              };\n            }\n            return a;\n          })\n        ];\n      } else {\n        this.localData = [\n          ...this.localData.map(a => {\n            if (a.value === item.value) {\n              return {\n                ...a,\n                checked: true,\n                // tslint:disable-next-line:no-shadowed-variable\n                children: item.children.map(a => {\n                  return {\n                    ...a,\n                    checked: true\n                  };\n                })\n              };\n            }\n            return a;\n          })\n        ];\n      }\n    } else {\n      if (cItem.checked) {\n        this.localData = [\n          ...this.localData.map(a => {\n            if (a.value === item.value) {\n              // tslint:disable-next-line:no-shadowed-variable\n              const children = a?.children.map(a => {\n                if (cItem?.value === a?.value) {\n                  return {\n                    ...a,\n                    checked: false\n                  };\n                }\n                return a;\n              });\n              return {\n                ...a,\n                checked: children.every(q => q.checked),\n                // tslint:disable-next-line:no-shadowed-variable\n                children\n              };\n            }\n            return a;\n          })\n        ];\n      } else {\n        this.localData = [\n          ...this.localData.map(a => {\n            if (a.value === item.value) {\n              // tslint:disable-next-line:no-shadowed-variable\n              const children = a?.children.map(a => {\n                if (cItem?.value === a?.value) {\n                  return {\n                    ...a,\n                    checked: true\n                  };\n                }\n                return a;\n              });\n              return {\n                ...a,\n                checked: children.every(q => q.checked),\n                // tslint:disable-next-line:no-shadowed-variable\n                children\n              };\n            }\n            return a;\n          })\n        ];\n      }\n    }\n    if (this.searchEnabled) {\n      this.searchInputOnChange(this.searchInput);\n    }\n  }\n\n  applyFilters() {\n    let localCount = 0;\n    this.localData.forEach(a =>\n      a?.children?.forEach(b => {\n        if (b.checked) {\n          localCount += 1;\n        }\n      })\n    );\n    this.selectedCount = localCount;\n    const w = this.localData\n      .filter(r => !(!r.checked && !r?.children?.some(f => f?.checked)))\n      .map(a => {\n        return {\n          ...a,\n          children: a?.children?.filter(s => s.checked)\n        };\n      });\n    this.onChange.emit(w);\n    this.onCancel();\n  }\n  onReset() {\n    this.isSearchInputFocused = false;\n    for (let item of this.localData) {\n      for (let child of item.children) {\n        child.checked = false;\n      }\n      item.checked = false;\n    }\n    this.onChange.emit([]);\n    this.isOpen = false;\n    this.searchInput = \"\";\n  }\n  onCancel() {\n    this.isSearchInputFocused = false;\n    this.isOpen = false;\n    this.overlayRef?.detach();\n    this.searchInput = \"\";\n  }\n}\nexport interface NestedMultiSelectDropdownItem {\n  label: string;\n  value: string;\n  checked?: boolean;\n  icon?: string;\n  children: Array<{\n    label: string;\n    value: string;\n    checked?: boolean;\n    icon?: string;\n  }>;\n}\n","import { CommonModule } from \"@angular/common\";\nimport { FormsModule } from \"@angular/forms\";\nimport { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { NestedMultiSelectDropdownComponent } from \"./nested-multi-select-dropdown.component\";\nimport { CheckboxModule } from \"mis-crystal-design-system/checkbox\";\nimport { ButtonModule } from \"mis-crystal-design-system/button\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\n\n@NgModule({\n  declarations: [NestedMultiSelectDropdownComponent],\n  imports: [CommonModule, FormsModule, OverlayModule, CheckboxModule, ButtonModule],\n  exports: [NestedMultiSelectDropdownComponent]\n})\nexport class NestedMultiSelectDropdownModule {\n  static forRoot(): ModuleWithProviders<NestedMultiSelectDropdownModule> {\n    return { ngModule: NestedMultiSelectDropdownModule, providers: [] };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/mis-crystal-design-system-phone-input.js

@@ -1,109 +0,0 @@
-import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
-import { FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { getCountries, getCountryCallingCode, parsePhoneNumberFromString } from 'libphonenumber-js';
-import { CommonModule } from '@angular/common';
-import { OverlayModule } from '@angular/cdk/overlay';
-import { ScrollingModule } from '@angular/cdk-experimental/scrolling';
-import { DropdownModule } from 'mis-crystal-design-system/dropdown';
-
-class PhoneInputComponent {
-    constructor() {
-        this.dropdownHeight = "";
-        this.dropdownWidth = "";
-        this.dropdownData = [];
-        this.dropdownSelectedItem = { value: "", label: "" };
-        this.defaultCountryCode = 'IN';
-        this.inputPlaceholder = 'Enter';
-        this.inputFormControl = new FormControl();
-        this.onDropdownSelection = new EventEmitter();
-        this.onInvalidPhoneNumber = new EventEmitter();
-        this.dropdownListWidth = "";
-        this.dropdownListHeight = "";
-        this.searchEnabled = true;
-        this.inputType = "number";
-        this.searchLabel = "Search Keyword";
-        this.phoneValidator = false;
-        this.countryCodes = [{ label: '', value: '' }];
-        this.selectedCountryName = '';
-    }
-    ngOnInit() {
-        if (this.phoneValidator) {
-            this.loadCountryCodes();
-            this.dropdownData = this.countryCodes;
-            this.selectedCountryName = this.dropdownSelectedItem.label;
-        }
-        if (this.defaultCountryCode) {
-            const selectedCountry = this.dropdownData.find(country => country.value.toUpperCase() === this.defaultCountryCode.toUpperCase());
-            if (selectedCountry) {
-                this.dropdownSelectedItem = selectedCountry;
-                this.selectedCountryName = selectedCountry.label;
-            }
-        }
-    }
-    handleDropdownSelection(item) {
-        this.dropdownSelectedItem = item;
-        this.onDropdownSelection.emit(item);
-        this.selectedCountryName = item.label;
-        this.validatePhoneNumber(this.inputFormControl.value, this.dropdownSelectedItem.value);
-    }
-    loadCountryCodes() {
-        const countries = getCountries();
-        this.countryCodes = countries.map(countryCode => ({
-            value: countryCode,
-            label: `${countryCode} (+${getCountryCallingCode(countryCode)})`
-        }));
-    }
-    validatePhoneNumber(phoneNumber, countryCode) {
-        const parsedPhoneNumber = parsePhoneNumberFromString(phoneNumber, countryCode);
-        if (!parsedPhoneNumber || !parsedPhoneNumber.isValid()) {
-            this.onInvalidPhoneNumber.emit(`Phone number is invalid for ${this.selectedCountryName}`);
-        }
-    }
-}
-PhoneInputComponent.decorators = [
-    { type: Component, args: [{
-                selector: "mis-phone-input",
-                template: "<div class=\"main-container-phone\">\n  <mis-dropdown [height]=\"dropdownHeight\" [dropdownListWidth]=\"dropdownListWidth\"[dropdownListHeight]=\"dropdownListHeight\" [width]=\"dropdownWidth\" [data]=\"dropdownData\" [selectedItem]=\"dropdownSelectedItem\" [label]=\"label\" [searchEnabled]=\"searchEnabled\" [multiLine]=\"false\" (onChange)=\"handleDropdownSelection($event)\" [searchLabel]=\"searchLabel\"></mis-dropdown>\n  <div class=\"details-field\">\n    <div class=\"input-box\">\n      <input\n      [ngStyle]=\"{'height': inputHeight }\"\n        class=\"black-text\"  \n        [placeholder]=\"inputPlaceholder\"\n        [formControl]=\"inputFormControl\" \n        [type]=\"inputType\"\n      />\n    </div>\n  </div>\n</div>\n",
-                styles: [".main-container-phone{display:flex;border:1px solid #e0e0e0;border-radius:6px}.details-field label{display:inline-block;min-width:224px;margin-right:24px}.details-field .input-box{width:100%}.details-field .input-box input{width:100%;height:32px}input{padding:10px 16px;border:none;outline:none;width:100%;height:auto;border-radius:6px}.black-text,input{color:#181f33;line-height:24px;font-size:16px}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.main-container-phone ::ng-deep .item{padding:8px!important}.main-container-phone ::ng-deep .dropdown{border:unset!important}"]
-            },] }
-];
-PhoneInputComponent.ctorParameters = () => [];
-PhoneInputComponent.propDecorators = {
-    dropdownHeight: [{ type: Input }],
-    dropdownWidth: [{ type: Input }],
-    inputHeight: [{ type: Input }],
-    dropdownData: [{ type: Input }],
-    dropdownSelectedItem: [{ type: Input }],
-    defaultCountryCode: [{ type: Input }],
-    label: [{ type: Input }],
-    inputPlaceholder: [{ type: Input }],
-    inputFormControl: [{ type: Input }],
-    onDropdownSelection: [{ type: Output }],
-    onInvalidPhoneNumber: [{ type: Output }],
-    dropdownListWidth: [{ type: Input }],
-    dropdownListHeight: [{ type: Input }],
-    searchEnabled: [{ type: Input }],
-    inputType: [{ type: Input }],
-    searchLabel: [{ type: Input }],
-    phoneValidator: [{ type: Input }]
-};
-
-class PhoneInputModule {
-    static forRoot() {
-        return { ngModule: PhoneInputModule, providers: [] };
-    }
-}
-PhoneInputModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [PhoneInputComponent],
-                imports: [CommonModule, ReactiveFormsModule, FormsModule, OverlayModule, ScrollingModule, DropdownModule],
-                exports: [PhoneInputComponent]
-            },] }
-];
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { PhoneInputComponent, PhoneInputModule };
-//# sourceMappingURL=mis-crystal-design-system-phone-input.js.map

package/fesm2015/mis-crystal-design-system-phone-input.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mis-crystal-design-system-phone-input.js","sources":["../../../projects/mis-components/phone-input/phone-input.component.ts","../../../projects/mis-components/phone-input/phone-input.module.ts","../../../projects/mis-components/phone-input/mis-crystal-design-system-phone-input.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnInit, Output } from \"@angular/core\";\nimport { FormControl } from \"@angular/forms\";\nimport { parsePhoneNumberFromString, getCountryCallingCode, CountryCode, getCountries } from 'libphonenumber-js';\nimport { DropdownItem } from \"mis-crystal-design-system/dropdown\";\n\n@Component({\n  selector: \"mis-phone-input\",\n  templateUrl: \"./phone-input.component.html\",\n  styleUrls: [\"./phone-input.component.scss\"]\n})\nexport class PhoneInputComponent implements OnInit {\n  @Input() dropdownHeight?: string = \"\";\n  @Input() dropdownWidth?: string = \"\";\n  @Input() inputHeight?;\n  @Input() dropdownData: DropdownItem[] = [];\n  @Input() dropdownSelectedItem: DropdownItem = { value: \"\", label: \"\" };\n  @Input() defaultCountryCode?: string = 'IN';\n  @Input() label: string;\n  @Input() inputPlaceholder: string = 'Enter';\n  @Input() inputFormControl: FormControl = new FormControl();\n  @Output() onDropdownSelection = new EventEmitter<any>();\n  @Output() onInvalidPhoneNumber = new EventEmitter<string>();\n  @Input() dropdownListWidth = \"\";\n  @Input() dropdownListHeight = \"\";\n  @Input() searchEnabled: boolean = true;\n  @Input() inputType: string = \"number\";\n  @Input() searchLabel: string = \"Search Keyword\";  \n  @Input() phoneValidator? = false;\n  \n  countryCodes: DropdownItem[] = [{label:'',value:''}];\n  countryCode: CountryCode | undefined;\n  selectedCountryName: string = '';\n\n  constructor() {}\n\n  ngOnInit() {\n    if (this.phoneValidator) {\n      this.loadCountryCodes();\n      this.dropdownData = this.countryCodes;\n      this.selectedCountryName = this.dropdownSelectedItem.label;\n    }\n\n    if (this.defaultCountryCode) {\n      const selectedCountry = this.dropdownData.find(\n        country => country.value.toUpperCase() === this.defaultCountryCode.toUpperCase()\n      );\n      if (selectedCountry) {\n        this.dropdownSelectedItem = selectedCountry;\n        this.selectedCountryName = selectedCountry.label;\n      }\n    }\n  }\n\n  handleDropdownSelection(item: DropdownItem){\n    this.dropdownSelectedItem = item;\n    this.onDropdownSelection.emit(item);\n    this.selectedCountryName = item.label;\n    this.validatePhoneNumber(this.inputFormControl.value, this.dropdownSelectedItem.value);\n  }\n\n  loadCountryCodes() {\n    const countries = getCountries();\n    this.countryCodes = countries.map(countryCode => ({\n      value: countryCode,\n      label: `${countryCode} (+${getCountryCallingCode(countryCode)})`\n    }));\n  }\n\n  validatePhoneNumber(phoneNumber: string, countryCode: string) {\n    const parsedPhoneNumber = parsePhoneNumberFromString(phoneNumber, countryCode as CountryCode);\n\n    if (!parsedPhoneNumber || !parsedPhoneNumber.isValid()) {\n      this.onInvalidPhoneNumber.emit(`Phone number is invalid for ${this.selectedCountryName}`);\n    }\n  }\n\n}\n","import { CommonModule } from \"@angular/common\";\nimport { FormsModule } from \"@angular/forms\";\nimport { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { PhoneInputComponent } from \"./phone-input.component\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\nimport { ScrollingModule } from \"@angular/cdk-experimental/scrolling\";\nimport { DropdownModule } from \"mis-crystal-design-system/dropdown\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\n\n\n@NgModule({\n  declarations: [PhoneInputComponent],\n  imports: [CommonModule,ReactiveFormsModule, FormsModule, OverlayModule, ScrollingModule, DropdownModule],\n  exports: [PhoneInputComponent]\n})\nexport class PhoneInputModule {\n  static forRoot(): ModuleWithProviders<PhoneInputModule> {\n    return { ngModule: PhoneInputModule, providers: [] };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/mis-crystal-design-system-radio-button.js

@@ -1,66 +0,0 @@
-import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
-import { FormControl, ReactiveFormsModule } from '@angular/forms';
-import { CommonModule } from '@angular/common';
-
-class RadioButtonComponent {
-    constructor() {
-        /** When multiple radio input fields are used
-         * an "id" can be given to keep track of them */
-        this.id = "";
-        /** Name of the attribute for which the radio
-         * selection is provided */
-        this.name = "";
-        /** Value of the attribute which is to be emitted
-         * when selected */
-        this.value = "";
-        /** Controls the state of the radio button */
-        this.disabled = false;
-        /** Can be used to attach the radio input field
-         * to a reactive form by passing in a
-         * “FormControl“ Object. It can also be
-         * used to set the default attribute value */
-        this.formControl = new FormControl(null);
-        /** Emits "value" of the radio button on selection */
-        this.valueChange = new EventEmitter();
-    }
-    ngOnInit() { }
-    onChange(event) {
-        this.valueChange.emit(this.formControl.value);
-    }
-}
-RadioButtonComponent.decorators = [
-    { type: Component, args: [{
-                selector: "mis-radio",
-                template: "<input (change)=\"onChange($event)\" id=\"{{ id }}\" type=\"radio\" [name]=\"name\" [disabled]=\"disabled\" [value]=\"value\" [formControl]=\"formControl\" />\n",
-                styles: ["input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;margin:0;padding:3px;background-clip:content-box;border:2px solid #6a737d;background-color:#fff;border-radius:50%;cursor:pointer}input[type=radio]:checked{background-color:#0937b2;border:2px solid #0937b2}input[type=radio]:hover{border:2px solid #929dab}input[type=radio]:checked:hover{border:2px solid #0937b2}input[type=radio]:disabled{border:2px solid #c8cdd3}input[type=radio]:checked:disabled{border:2px solid #c8cdd3;background-color:#c8cdd3}"]
-            },] }
-];
-RadioButtonComponent.ctorParameters = () => [];
-RadioButtonComponent.propDecorators = {
-    id: [{ type: Input }],
-    name: [{ type: Input }],
-    value: [{ type: Input }],
-    disabled: [{ type: Input }],
-    formControl: [{ type: Input }],
-    valueChange: [{ type: Output }]
-};
-
-class RadioButtonModule {
-    static forRoot() {
-        return { ngModule: RadioButtonModule, providers: [] };
-    }
-}
-RadioButtonModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [RadioButtonComponent],
-                imports: [CommonModule, ReactiveFormsModule],
-                exports: [RadioButtonComponent]
-            },] }
-];
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { RadioButtonComponent, RadioButtonModule };
-//# sourceMappingURL=mis-crystal-design-system-radio-button.js.map

package/fesm2015/mis-crystal-design-system-radio-button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mis-crystal-design-system-radio-button.js","sources":["../../../projects/mis-components/radio-button/radio-button.component.ts","../../../projects/mis-components/radio-button/radio-button.module.ts","../../../projects/mis-components/radio-button/mis-crystal-design-system-radio-button.ts"],"sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter } from \"@angular/core\";\nimport { AbstractControl, FormControl } from \"@angular/forms\";\n\n@Component({\n  selector: \"mis-radio\",\n  templateUrl: \"./radio-button.component.html\",\n  styleUrls: [\"./radio-button.component.scss\"]\n})\nexport class RadioButtonComponent implements OnInit {\n  /** When multiple radio input fields are used\n   * an \"id\" can be given to keep track of them */\n  @Input() id: string | number = \"\";\n  /** Name of the attribute for which the radio\n   * selection is provided */\n  @Input() name: string | number = \"\";\n  /** Value of the attribute which is to be emitted\n   * when selected */\n  @Input() value: string | number = \"\";\n  /** Controls the state of the radio button */\n  @Input() disabled: boolean = false;\n\n  /** Can be used to attach the radio input field\n   * to a reactive form by passing in a\n   * “FormControl“ Object. It can also be\n   * used to set the default attribute value */\n  @Input() formControl: AbstractControl = new FormControl(null);\n\n  /** Emits \"value\" of the radio button on selection */\n  @Output() valueChange = new EventEmitter<any>();\n\n  constructor() {}\n  ngOnInit() {}\n  onChange(event) {\n    this.valueChange.emit(this.formControl.value);\n  }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { RadioButtonComponent } from \"./radio-button.component\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\n\n@NgModule({\n  declarations: [RadioButtonComponent],\n  imports: [CommonModule, ReactiveFormsModule],\n  exports: [RadioButtonComponent]\n})\nexport class RadioButtonModule {\n  static forRoot(): ModuleWithProviders<RadioButtonModule> {\n    return { ngModule: RadioButtonModule, providers: [] };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAQa,oBAAoB;IAsB/B;;;QAnBS,OAAE,GAAoB,EAAE,CAAC;;;QAGzB,SAAI,GAAoB,EAAE,CAAC;;;QAG3B,UAAK,GAAoB,EAAE,CAAC;;QAE5B,aAAQ,GAAY,KAAK,CAAC;;;;;QAM1B,gBAAW,GAAoB,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC;;QAGpD,gBAAW,GAAG,IAAI,YAAY,EAAO,CAAC;KAEhC;IAChB,QAAQ,MAAK;IACb,QAAQ,CAAC,KAAK;QACZ,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;KAC/C;;;YA/BF,SAAS,SAAC;gBACT,QAAQ,EAAE,WAAW;gBACrB,4KAA4C;;aAE7C;;;;iBAIE,KAAK;mBAGL,KAAK;oBAGL,KAAK;uBAEL,KAAK;0BAML,KAAK;0BAGL,MAAM;;;MCjBI,iBAAiB;IAC5B,OAAO,OAAO;QACZ,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC;KACvD;;;YARF,QAAQ,SAAC;gBACR,YAAY,EAAE,CAAC,oBAAoB,CAAC;gBACpC,OAAO,EAAE,CAAC,YAAY,EAAE,mBAAmB,CAAC;gBAC5C,OAAO,EAAE,CAAC,oBAAoB,CAAC;aAChC;;;ACVD;;;;;;"}

package/fesm2015/mis-crystal-design-system-ske-loader.js

@@ -1,49 +0,0 @@
-import { Component, Input, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-class SkeLoaderComponent {
-    constructor() {
-        this.rowCount = [1];
-        this.lineHeight = '20px';
-        this.height = '100%';
-        this.width = '100%';
-        this.gap = '8px';
-    }
-    set count(num) {
-        this.rowCount = Array(num);
-    }
-    ;
-    ngOnInit() { }
-}
-SkeLoaderComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'mis-skeleton-loader',
-                template: "<div style=\"overflow: hidden\" [ngStyle]=\"{'height': this.height,'width' : this.width}\">\n    <div *ngFor=\"let n of rowCount; let i = index;\">\n        <div class=\"ske-loader\" [ngStyle]=\"{'height':this.lineHeight,'margin-bottom':this.gap }\"></div>\n    </div>\n</div>\n",
-                styles: [".ske-loader{background:grey;position:relative;width:100%;background:#e5e5e5;background:linear-gradient(110deg,#ececec 8%,#f5f5f5 18%,#ececec 33%);border-radius:5px;background-size:200% 100%;-webkit-animation:shine 1s linear infinite;animation:shine 1s linear infinite;overflow:hidden}@-webkit-keyframes shine{to{background-position-x:-200%}}@keyframes shine{to{background-position-x:-200%}}"]
-            },] }
-];
-SkeLoaderComponent.ctorParameters = () => [];
-SkeLoaderComponent.propDecorators = {
-    count: [{ type: Input }],
-    lineHeight: [{ type: Input }],
-    height: [{ type: Input }],
-    width: [{ type: Input }],
-    gap: [{ type: Input }]
-};
-
-class SkeLoaderModule {
-}
-SkeLoaderModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [SkeLoaderComponent],
-                imports: [CommonModule],
-                exports: [SkeLoaderComponent]
-            },] }
-];
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { SkeLoaderComponent, SkeLoaderModule };
-//# sourceMappingURL=mis-crystal-design-system-ske-loader.js.map

package/fesm2015/mis-crystal-design-system-ske-loader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mis-crystal-design-system-ske-loader.js","sources":["../../../projects/mis-components/ske-loader/ske-loader.component.ts","../../../projects/mis-components/ske-loader/ske-loader.module.ts","../../../projects/mis-components/ske-loader/mis-crystal-design-system-ske-loader.ts"],"sourcesContent":["import { Component, OnInit, Input } from '@angular/core';\n\n@Component({\n  selector: 'mis-skeleton-loader',\n  templateUrl: './ske-loader.component.html',\n  styleUrls: ['./ske-loader.component.scss']\n})\nexport class SkeLoaderComponent implements OnInit {\n\n  rowCount = [1];\n  @Input() set count(num: number) {\n    this.rowCount = Array(num)\n  };\n  @Input() lineHeight: string = '20px';\n  @Input() height: string = '100%';\n  @Input() width: string = '100%';\n  @Input() gap: string = '8px'\n\n  constructor() { }\n\n  ngOnInit(): void {}\n\n}\n","import { CommonModule } from \"@angular/common\";\nimport { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { SkeLoaderComponent } from \"./ske-loader.component\";\n\n@NgModule({\n  declarations: [SkeLoaderComponent],\n  imports: [CommonModule],\n  exports: [SkeLoaderComponent]\n})\nexport class SkeLoaderModule {\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;MAOa,kBAAkB;IAW7B;QATA,aAAQ,GAAG,CAAC,CAAC,CAAC,CAAC;QAIN,eAAU,GAAW,MAAM,CAAC;QAC5B,WAAM,GAAW,MAAM,CAAC;QACxB,UAAK,GAAW,MAAM,CAAC;QACvB,QAAG,GAAW,KAAK,CAAA;KAEX;IARjB,IAAa,KAAK,CAAC,GAAW;QAC5B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,CAAA;KAC3B;;IAQD,QAAQ,MAAW;;;YAlBpB,SAAS,SAAC;gBACT,QAAQ,EAAE,qBAAqB;gBAC/B,kSAA0C;;aAE3C;;;;oBAIE,KAAK;yBAGL,KAAK;qBACL,KAAK;oBACL,KAAK;kBACL,KAAK;;;MCPK,eAAe;;;YAL3B,QAAQ,SAAC;gBACR,YAAY,EAAE,CAAC,kBAAkB,CAAC;gBAClC,OAAO,EAAE,CAAC,YAAY,CAAC;gBACvB,OAAO,EAAE,CAAC,kBAAkB,CAAC;aAC9B;;;ACRD;;;;;;"}