mis-crystal-design-system 4.0.21 → 4.0.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export { MobileFilterModule } from './mobile-filter.module';
|
|
2
2
|
export { MobileFilterComponent } from './mobile-filter.component';
|
|
3
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
3
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL21pcy1jb21wb25lbnRzL21vYmlsZS1maWx0ZXIvcHVibGljX2FwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUM1RCxPQUFPLEVBQUUscUJBQXFCLEVBQWtCLE1BQU0sMkJBQTJCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgeyBNb2JpbGVGaWx0ZXJNb2R1bGUgfSBmcm9tICcuL21vYmlsZS1maWx0ZXIubW9kdWxlJztcbmV4cG9ydCB7IE1vYmlsZUZpbHRlckNvbXBvbmVudCwgSUZpbHRlck9wdGlvbnMgfSBmcm9tICcuL21vYmlsZS1maWx0ZXIuY29tcG9uZW50JzsiXX0=
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"__symbolic":"module","version":4,"metadata":{"MobileFilterModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MobileFilterComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12},{"__symbolic":"reference","module":"mis-crystal-design-system/button","name":"ButtonModule","line":8,"character":26},{"__symbolic":"reference","module":"mis-crystal-design-system/checkbox","name":"CheckboxModule","line":8,"character":40}],"exports":[{"__symbolic":"reference","name":"MobileFilterComponent"}]}]}],"members":{}},"MobileFilterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"mis-mobile-filter","template":"<div class=\"filters-container\">\n <div class=\"head display-flex\">\n <img (click)=\"closeFilters.emit();\" [src]=\"backIcon\" alt=\"\">\n <span>{{headerName}}</span>\n </div>\n <div class=\"body display-flex\">\n <div class=\"filters\">\n <ng-container *ngFor=\"let filter of localFilterOptions | keyvalue : originalOrder\">\n <div class=\"filter display-flex\" (click)=\"currentSelectedItem = filter.key\">\n <span class=\"filterName\" [ngStyle]=\"{'color': filter.key === currentSelectedItem ? '#0937B2' : '#181F33'}\">{{ filter.key }}</span>\n <span class=\"selectedNumber\" *ngIf=\"localFilterOptions[filter.key]['multiSelect'] && localFilterOptions[filter.key]['noOfSelectedItems'] > 0\">{{ localFilterOptions[filter.key]['noOfSelectedItems'] }}</span>\n <div class=\"highlightor\" *ngIf=\"filter.key === currentSelectedItem\"></div>\n </div>\n </ng-container>\n </div>\n <div class=\"filter-options-container\">\n <div class=\"filter-options-title\">\n <span>{{ currentSelectedItem }}</span>\n </div>\n <div class=\"filter-options\">\n <ng-container *ngFor=\"let option of localFilterOptions[currentSelectedItem]?.options; let i = index\">\n <div class=\"filter-option display-flex\" (click)=\"toggleFilter(option.value, option.selected)\" >\n <mis-checkbox *ngIf=\"localFilterOptions[currentSelectedItem].multiSelect\" [checked]=\"option.selected\"></mis-checkbox>\n <input type=\"radio\" *ngIf=\"!localFilterOptions[currentSelectedItem].multiSelect\" [checked]=\"option.selected\">\n <span [ngStyle]=\"{'color': option.selected ? '#181F33' : '#6A737D'}\">{{ option.label }}</span>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"footer display-flex\">\n <button\n mis-button\n size=\"md\"\n type=\"text\"\n (click)=\"clearFilters.emit()\">\n {{clearBtnName}}\n </button>\n <button\n mis-button\n size=\"md\"\n type=\"primary\"\n (click)=\"applyFilters.emit(localFilterOptions)\"\n >\n {{applyBtnName}}\n </button>\n </div>\n</div>\n","styles":[".display-flex{display:flex}.filters-container{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#fff;cursor:default}.filters-container *{font-family:Lato}.filters-container .head{height:56px;border-bottom:1px solid #e0e0e0;justify-content:flex-start;align-items:center;padding:0 16px;gap:12px}.filters-container .head img{cursor:pointer}.filters-container .head span{font-weight:700;font-size:17px;line-height:24px;letter-spacing:.2px}.filters-container .body{height:calc(100vh - 129px)}.filters-container .body .filters{width:120px;border-right:1px solid #e0e0e0;flex-shrink:0}.filters-container .body .filters .filter{height:56px;padding:0 16px;border-bottom:1px solid #e0e0e0;align-items:center;font-size:15px;justify-content:space-between;position:relative}.filters-container .body .filters .filter .filterName{color:#6a737d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filters-container .body .filters .filter .selectedNumber{background-color:#f5f5f5;height:24px;width:auto;font-size:14px;min-width:24px;border-radius:50%;text-align:center;line-height:24px;padding:0 8px}.filters-container .body .filters .filter .highlightor{position:absolute;left:0;height:100%;width:4px;background-color:#0937b2}.filters-container .body .filter-options-container{padding:16px 16px 0 12px;width:calc(100% - 56px);overflow-x:hidden}.filters-container .body .filter-options-container *{color:#181f33}.filters-container .body .filter-options-container .filter-options-title{text-transform:uppercase;font-size:12px;line-height:16px;letter-spacing:.25px}.filters-container .body .filter-options-container .filter-options-title span{color:#6a737d}.filters-container .body .filter-options-container .filter-options{margin-top:16px;overflow-y:scroll;height:calc(100% - 32px)}.filters-container .body .filter-options-container .filter-options .filter-option{height:48px;border-bottom:1px solid #e0e0e0;align-items:center;padding-left:16px;gap:13px;font-size:15px}.filters-container .body .filter-options-container .filter-options .filter-option span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filters-container .body .filter-options-container .filter-options .filter-option input[type=radio]{accent-color:#0937b2;width:20px;height:20px}.filters-container .footer{height:73px;border-top:1px solid #e0e0e0;padding:0 16px;align-items:center;justify-content:space-between}.filters-container .footer button{width:160px}"]}]}],"members":{"filterOptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"backIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"headerName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"applyBtnName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"clearBtnName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"closeFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":22,"character":3}}]}],"clearFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":3}}]}],"applyFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":24,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"originalOrder":[{"__symbolic":"method"}],"toggleFilter":[{"__symbolic":"method"}]}}},"origins":{"MobileFilterModule":"./mobile-filter.module","MobileFilterComponent":"./mobile-filter.component"},"importAs":"mis-crystal-design-system/mobile-filter"}
|
|
1
|
+
{"__symbolic":"module","version":4,"metadata":{"MobileFilterModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MobileFilterComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12},{"__symbolic":"reference","module":"mis-crystal-design-system/button","name":"ButtonModule","line":8,"character":26},{"__symbolic":"reference","module":"mis-crystal-design-system/checkbox","name":"CheckboxModule","line":8,"character":40}],"exports":[{"__symbolic":"reference","name":"MobileFilterComponent"}]}]}],"members":{}},"MobileFilterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"mis-mobile-filter","template":"<div class=\"filters-container\">\n <div class=\"head display-flex\">\n <img (click)=\"closeFilters.emit();\" [src]=\"backIcon\" alt=\"\">\n <span>{{headerName}}</span>\n </div>\n <div class=\"body display-flex\">\n <div class=\"filters\">\n <ng-container *ngFor=\"let filter of localFilterOptions | keyvalue : originalOrder\">\n <div class=\"filter display-flex\" (click)=\"currentSelectedItem = filter.key\">\n <span class=\"filterName\" [ngStyle]=\"{'color': filter.key === currentSelectedItem ? '#0937B2' : '#181F33'}\">{{ filter.key }}</span>\n <span class=\"selectedNumber\" *ngIf=\"localFilterOptions[filter.key]['multiSelect'] && localFilterOptions[filter.key]['noOfSelectedItems'] > 0\">{{ localFilterOptions[filter.key]['noOfSelectedItems'] }}</span>\n <div class=\"highlightor\" *ngIf=\"filter.key === currentSelectedItem\"></div>\n </div>\n </ng-container>\n </div>\n <div class=\"filter-options-container\">\n <div class=\"filter-options-title\">\n <span>{{ currentSelectedItem }}</span>\n </div>\n <div class=\"filter-options\">\n <ng-container *ngFor=\"let option of localFilterOptions[currentSelectedItem]?.options; let i = index\">\n <div class=\"filter-option display-flex\" (click)=\"toggleFilter(option.value, option.selected)\" >\n <mis-checkbox *ngIf=\"localFilterOptions[currentSelectedItem].multiSelect\" [checked]=\"option.selected\"></mis-checkbox>\n <input type=\"radio\" *ngIf=\"!localFilterOptions[currentSelectedItem].multiSelect\" [checked]=\"option.selected\">\n <span [ngStyle]=\"{'color': option.selected ? '#181F33' : '#6A737D'}\">{{ option.label }}</span>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"footer display-flex\">\n <button\n mis-button\n size=\"md\"\n type=\"text\"\n (click)=\"clearFilters.emit()\">\n {{clearBtnName}}\n </button>\n <button\n mis-button\n size=\"md\"\n type=\"primary\"\n (click)=\"applyFilters.emit(localFilterOptions)\"\n >\n {{applyBtnName}}\n </button>\n </div>\n</div>\n","styles":[".display-flex{display:flex}.filters-container{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#fff;cursor:default}.filters-container *{font-family:Lato}.filters-container .head{height:56px;border-bottom:1px solid #e0e0e0;justify-content:flex-start;align-items:center;padding:0 16px;gap:12px}.filters-container .head img{cursor:pointer}.filters-container .head span{font-weight:700;font-size:17px;line-height:24px;letter-spacing:.2px}.filters-container .body{height:calc(100vh - 129px)}.filters-container .body .filters{width:120px;border-right:1px solid #e0e0e0;flex-shrink:0}.filters-container .body .filters .filter{height:56px;padding:0 16px;border-bottom:1px solid #e0e0e0;align-items:center;font-size:15px;justify-content:space-between;position:relative}.filters-container .body .filters .filter .filterName{color:#6a737d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filters-container .body .filters .filter .selectedNumber{background-color:#f5f5f5;height:24px;width:auto;font-size:14px;min-width:24px;border-radius:50%;text-align:center;line-height:24px;padding:0 8px}.filters-container .body .filters .filter .highlightor{position:absolute;left:0;height:100%;width:4px;background-color:#0937b2}.filters-container .body .filter-options-container{padding:16px 16px 0 12px;width:calc(100% - 56px);overflow-x:hidden}.filters-container .body .filter-options-container *{color:#181f33}.filters-container .body .filter-options-container .filter-options-title{text-transform:uppercase;font-size:12px;line-height:16px;letter-spacing:.25px}.filters-container .body .filter-options-container .filter-options-title span{color:#6a737d}.filters-container .body .filter-options-container .filter-options{margin-top:16px;overflow-y:scroll;height:calc(100% - 32px)}.filters-container .body .filter-options-container .filter-options .filter-option{height:48px;border-bottom:1px solid #e0e0e0;align-items:center;padding-left:16px;gap:13px;font-size:15px}.filters-container .body .filter-options-container .filter-options .filter-option span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filters-container .body .filter-options-container .filter-options .filter-option input[type=radio]{accent-color:#0937b2;width:20px;height:20px}.filters-container .footer{height:73px;border-top:1px solid #e0e0e0;padding:0 16px;align-items:center;justify-content:space-between}.filters-container .footer button{width:160px}"]}]}],"members":{"filterOptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"backIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"headerName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"applyBtnName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"clearBtnName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"closeFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":22,"character":3}}]}],"clearFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":3}}]}],"applyFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":24,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"originalOrder":[{"__symbolic":"method"}],"toggleFilter":[{"__symbolic":"method"}]}},"IFilterOptions":{"__symbolic":"interface"}},"origins":{"MobileFilterModule":"./mobile-filter.module","MobileFilterComponent":"./mobile-filter.component","IFilterOptions":"./mobile-filter.component"},"importAs":"mis-crystal-design-system/mobile-filter"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { MobileFilterModule } from './mobile-filter.module';
|
|
2
|
-
export { MobileFilterComponent } from './mobile-filter.component';
|
|
2
|
+
export { MobileFilterComponent, IFilterOptions } from './mobile-filter.component';
|