npm - @sd-angular/core - Versions diffs - 1.1.75 → 1.1.78 - Mend

@sd-angular/core 1.1.75 → 1.1.78

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.

Files changed (47) hide show

package/fesm2015/sd-angular-core-filter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sd-angular-core-filter.js","sources":["../../../../projects/sd-core/filter/src/lib/directives/sd-filter-def.directive.ts","../../../../projects/sd-core/filter/src/lib/filter.service.ts","../../../../projects/sd-core/filter/src/lib/filter.component.ts","../../../../projects/sd-core/filter/src/lib/pipes/values-local.pipe.ts","../../../../projects/sd-core/filter/src/lib/pipes/values-server.pipe.ts","../../../../projects/sd-core/filter/src/lib/filter.module.ts","../../../../projects/sd-core/filter/src/public-api.ts","../../../../projects/sd-core/filter/sd-angular-core-filter.ts"],"sourcesContent":["import { Directive, Input, TemplateRef } from '@angular/core';\r\n\r\n@Directive({\r\n selector: '[sdFilterDef]'\r\n})\r\nexport class SdFilterDefDirective {\r\n @Input() sdFilterDef: string;\r\n defaultShowing: boolean;\r\n @Input('defaultShowing') set _defaultShowing(val: boolean \| '') {\r\n this.defaultShowing = (val === '') \|\| val;\r\n }\r\n constructor(public templateRef: TemplateRef<any>) { }\r\n}\r\n","import { Injectable } from '@angular/core';\r\nimport hash from 'object-hash';\r\nimport { SdSettingService } from '@sd-angular/core/setting';\r\nimport { SdFilterInformation } from './filter.model';\r\n\r\n@Injectable()\r\nexport class SdFilterService {\r\n #prefix = '61d22e8e-eee8-4aad-8e1c-044a532fea91';\r\n constructor(private settingService: SdSettingService) {\r\n }\r\n get = async (key: string): Promise<SdFilterInformation> => {\r\n if (!key) {\r\n return {\r\n selectedQuickFilter: null,\r\n quickFilters: [],\r\n filter: {}\r\n }\r\n }\r\n const { get } = this.settingService.create<SdFilterInformation>({\r\n prefix: this.#prefix,\r\n key\r\n });\r\n const configuration = await get();\r\n return {\r\n selectedQuickFilter: configuration?.selectedQuickFilter ?? null,\r\n quickFilters: configuration?.quickFilters \|\| [],\r\n filter: configuration?.filter \|\| {}\r\n };\r\n }\r\n\r\n set = async (key: string, configuration: SdFilterInformation): Promise<SdFilterInformation> => {\r\n configuration = {\r\n selectedQuickFilter: configuration?.selectedQuickFilter ?? null,\r\n quickFilters: configuration?.quickFilters \|\| [],\r\n filter: configuration?.filter \|\| {}\r\n };\r\n if (!key) {\r\n return configuration;\r\n }\r\n const { set } = this.settingService.create<SdFilterInformation>({\r\n prefix: this.#prefix,\r\n key\r\n });\r\n key = hash({\r\n prefix: this.#prefix,\r\n key\r\n });\r\n await set(configuration);\r\n return configuration;\r\n }\r\n}\r\n","import { Component, Input, Output, EventEmitter, ViewChild, AfterViewInit, OnDestroy, ContentChildren, QueryList } from '@angular/core';\r\nimport { BehaviorSubject, Observable, Subject, Subscription } from 'rxjs';\r\nimport { map, startWith, switchMap } from 'rxjs/operators';\r\nimport * as uuid from 'uuid';\r\nimport * as hash from 'object-hash';\r\nimport { DeviceDetectorService } from 'ngx-device-detector';\r\nimport { SdFilterDefDirective } from './directives/sd-filter-def.directive';\r\nimport { Filter, SdFilterInformation, FilterObject, SdFilterOption, SdQuickFilter } from './filter.model';\r\nimport { SdFilterService } from './filter.service';\r\nimport { SdSetting, SdSettingService } from '@sd-angular/core/setting';\r\nimport { SdCacheService } from '@sd-angular/core/cache';\r\n\r\n@Component({\r\n selector: 'sd-filter',\r\n templateUrl: './filter.component.html',\r\n styleUrls: ['./filter.component.scss']\r\n})\r\nexport class SdFilter implements AfterViewInit, OnDestroy {\r\n #prefix = '61d22e8e-eee8-4aad-8e1c-044a532fea91';\r\n setting: SdSetting<SdFilterInformation>;\r\n filterOption: SdFilterOption;\r\n @Input('option') set _filterOption(option: SdFilterOption) {\r\n console.log(option);\r\n if (option) {\r\n this.filterOption = option;\r\n this.#filterOptionChanges.next(option);\r\n }\r\n }\r\n #filterOptionChanges = new BehaviorSubject<SdFilterOption>(null);\r\n #subscription = new Subscription();\r\n @ContentChildren(SdFilterDefDirective) sdFilterDefs = new QueryList<SdFilterDefDirective>();\r\n isMobileOrTablet = false;\r\n filterChanges = new BehaviorSubject<FilterObject>({});\r\n filterInformation: Observable<SdFilterInformation>;\r\n information: SdFilterInformation;\r\n constructor(\r\n private deviceService: DeviceDetectorService,\r\n private settingService: SdSettingService,\r\n private filterService: SdFilterService) {\r\n this.isMobileOrTablet = !this.deviceService.isDesktop();\r\n }\r\n\r\n ngOnInit() {\r\n // if (!this.#key) {\r\n // this.setting = this.settingService.create<SdFilterInformation>(uuid.v4(), {\r\n // type: 'session',\r\n // default: {\r\n // filter: {},\r\n // visible: {},\r\n // quickFilters: [],\r\n // selectedQuickFilter: null\r\n // }\r\n // });\r\n // } else {\r\n // this.setting = this.settingService.create<SdFilterInformation>(this.#key, {\r\n // default: {\r\n // filter: {},\r\n // visible: {},\r\n // quickFilters: [],\r\n // selectedQuickFilter: null\r\n // }\r\n // });\r\n // }\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n this.#subscription.add(this.#filterOptionChanges.pipe(startWith(this.filterOption)).subscribe((filterOption) => {\r\n console.log(filterOption);\r\n if (!filterOption) {\r\n return;\r\n }\r\n const defaultInformation: SdFilterInformation = {\r\n filter: {},\r\n visible: {},\r\n quickFilters: filterOption?.quickFilter?.defaults \|\| [],\r\n selectedQuickFilter: filterOption?.quickFilter?.selectedDefault\r\n };\r\n if (!filterOption.key) {\r\n this.setting = this.settingService.create<SdFilterInformation>(uuid.v4(), {\r\n type: 'session',\r\n default: defaultInformation\r\n });\r\n } else {\r\n this.setting = this.settingService.create<SdFilterInformation>({\r\n prefix: this.#prefix,\r\n key: filterOption.key\r\n }, {\r\n default: defaultInformation\r\n });\r\n }\r\n this.information = this.setting.get();\r\n console.log(this.information);\r\n this.#subscription.add(this.setting.observer.subscribe(filterInformation => {\r\n this.information = filterInformation;\r\n this.#format(filterOption?.filters, this.information);\r\n }));\r\n }));\r\n }\r\n\r\n onFilter = (filter?: Filter) => {\r\n this.filterChanges.next({\r\n filter: { ...this.information.filter },\r\n filterDef: { ...this.information.filterDef },\r\n });\r\n this.setting.set(this.information);\r\n }\r\n\r\n onClear = () => {\r\n this.information.filter = {};\r\n this.information.filterDef = {};\r\n this.onFilter();\r\n }\r\n\r\n #format = (filters: Filter[], information: SdFilterInformation) => {\r\n for (const filter of filters) {\r\n if (filter.type === 'daterange') {\r\n information.filter[filter.field] = {\r\n from: information.filter[filter.field]?.from ?? undefined,\r\n to: information.filter[filter.field]?.to ?? undefined\r\n };\r\n } else {\r\n information.filter[filter.field] = information.filter[filter.field] ?? undefined;\r\n }\r\n }\r\n }\r\n\r\n #firstLoad = (filters: Filter[], information: SdFilterInformation) => {\r\n if (information.selectedQuickFilter && information.quickFilters.some(e => e.code === information.selectedQuickFilter)) {\r\n const selected = information.quickFilters.find(e => e.code === information.selectedQuickFilter);\r\n information.filter = { ...selected.filter };\r\n information.filterDef = { ...selected.filterDef };\r\n this.#format(filters, information);\r\n } else {\r\n for (const filter of filters) {\r\n if (filter.type === 'daterange') {\r\n information.filter[filter.field] = {\r\n from: information.filter[filter.field]?.from ?? filter.default?.from ?? undefined,\r\n to: information.filter[filter.field]?.to ?? filter.default?.to ?? undefined\r\n };\r\n } else {\r\n information.filter[filter.field] = information.filter[filter.field] ?? filter.default ?? undefined;\r\n }\r\n }\r\n }\r\n }\r\n\r\n ngOnDestroy() {\r\n this.#subscription.unsubscribe();\r\n }\r\n\r\n setFilter = (args: {\r\n filter: any,\r\n filterDef: any\r\n }) => {\r\n const { filter, filterDef } = args;\r\n this.information = {\r\n ...this.information,\r\n filter: { ...filter },\r\n filterDef: { ...filterDef }\r\n };\r\n }\r\n}\r\n","import { Pipe, PipeTransform } from '@angular/core';\r\nimport { ValuesLocalFilter } from '../filter.model';\r\n\r\n@Pipe({\r\n name: 'sdValuesLocal'\r\n})\r\nexport class SdValuesLocalPipe implements PipeTransform {\r\n transform = async (filterValues: ValuesLocalFilter): Promise<any[]> => {\r\n if(typeof(filterValues?.option?.items) === 'function') {\r\n return await filterValues?.option?.items();\r\n }\r\n return filterValues?.option?.items \|\| [];\r\n }\r\n}\r\n","import { Pipe, PipeTransform } from '@angular/core';\r\nimport { ValuesLocalFilter, ValuesServerFilter } from '../filter.model';\r\n\r\n@Pipe({\r\n name: 'sdValuesServer'\r\n})\r\nexport class SdValuesServerPipe implements PipeTransform {\r\n transform = (filterValues: ValuesServerFilter): any[] \| ((searchText: string \| string[], isFormValue?: boolean) => Promise<any[]>) => {\r\n if(typeof(filterValues?.option?.items) === 'function') {\r\n return filterValues?.option?.items;\r\n }\r\n return filterValues?.option?.items \|\| [];\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { SdCommonModule } from '@sd-angular/core/common';\r\nimport { SdFilterDefDirective } from './directives/sd-filter-def.directive';\r\nimport { SdFilter } from './filter.component';\r\nimport { SdFormModule } from '@sd-angular/core/form';\r\nimport { SdValuesLocalPipe } from './pipes/values-local.pipe';\r\nimport { SdValuesServerPipe } from './pipes/values-server.pipe';\r\nimport { SdFilterService } from './filter.service';\r\nimport { MatButtonModule } from '@angular/material/button';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n MatFormFieldModule,\r\n MatInputModule,\r\n MatIconModule,\r\n MatTooltipModule,\r\n MatButtonModule,\r\n SdTranslateModule,\r\n SdCommonModule,\r\n SdFormModule\r\n ],\r\n declarations: [\r\n SdFilter,\r\n SdFilterDefDirective,\r\n SdValuesLocalPipe,\r\n SdValuesServerPipe\r\n ],\r\n providers: [\r\n SdFilterService\r\n ],\r\n exports: [\r\n SdCommonModule,\r\n SdFilterDefDirective,\r\n SdFilter\r\n ]\r\n})\r\nexport class SdFilterModule { }\r\n","/\r\n Public API Surface of superdev-angular-core\r\n /\r\n\r\nexport from './lib/filter.module';\r\nexport * from './lib/directives/sd-filter-def.directive';\r\nexport * from './lib/filter.model';\r\nexport * from './lib/filter.component';","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n\nexport {SdFilterService as ɵa} from './src/lib/filter.service';\nexport {SdValuesLocalPipe as ɵb} from './src/lib/pipes/values-local.pipe';\nexport {SdValuesServerPipe as ɵc} from './src/lib/pipes/values-server.pipe';"],"names":["_prefix","uuid.v4"],"mappings":"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"}
1	+ {"version":3,"file":"sd-angular-core-filter.js","sources":["../../../../projects/sd-core/filter/src/lib/directives/sd-filter-def.directive.ts","../../../../projects/sd-core/filter/src/lib/filter.service.ts","../../../../projects/sd-core/filter/src/lib/filter.component.ts","../../../../projects/sd-core/filter/src/lib/pipes/values-local.pipe.ts","../../../../projects/sd-core/filter/src/lib/pipes/values-server.pipe.ts","../../../../projects/sd-core/filter/src/lib/filter.module.ts","../../../../projects/sd-core/filter/src/public-api.ts","../../../../projects/sd-core/filter/sd-angular-core-filter.ts"],"sourcesContent":["import { Directive, Input, TemplateRef } from '@angular/core';\r\n\r\n@Directive({\r\n selector: '[sdFilterDef]'\r\n})\r\nexport class SdFilterDefDirective {\r\n @Input() sdFilterDef: string;\r\n defaultShowing: boolean;\r\n @Input('defaultShowing') set _defaultShowing(val: boolean \| '') {\r\n this.defaultShowing = (val === '') \|\| val;\r\n }\r\n constructor(public templateRef: TemplateRef<any>) { }\r\n}\r\n","import { Injectable } from '@angular/core';\r\nimport hash from 'object-hash';\r\nimport { SdSettingService } from '@sd-angular/core/setting';\r\nimport { SdFilterInformation } from './filter.model';\r\n\r\n@Injectable()\r\nexport class SdFilterService {\r\n #prefix = '61d22e8e-eee8-4aad-8e1c-044a532fea91';\r\n constructor(private settingService: SdSettingService) {\r\n }\r\n get = async (key: string): Promise<SdFilterInformation> => {\r\n if (!key) {\r\n return {\r\n selectedQuickFilter: null,\r\n quickFilters: [],\r\n filter: {}\r\n }\r\n }\r\n const { get } = this.settingService.create<SdFilterInformation>({\r\n prefix: this.#prefix,\r\n key\r\n });\r\n const configuration = await get();\r\n return {\r\n selectedQuickFilter: configuration?.selectedQuickFilter ?? null,\r\n quickFilters: configuration?.quickFilters \|\| [],\r\n filter: configuration?.filter \|\| {}\r\n };\r\n }\r\n\r\n set = async (key: string, configuration: SdFilterInformation): Promise<SdFilterInformation> => {\r\n configuration = {\r\n selectedQuickFilter: configuration?.selectedQuickFilter ?? null,\r\n quickFilters: configuration?.quickFilters \|\| [],\r\n filter: configuration?.filter \|\| {}\r\n };\r\n if (!key) {\r\n return configuration;\r\n }\r\n const { set } = this.settingService.create<SdFilterInformation>({\r\n prefix: this.#prefix,\r\n key\r\n });\r\n key = hash({\r\n prefix: this.#prefix,\r\n key\r\n });\r\n await set(configuration);\r\n return configuration;\r\n }\r\n}\r\n","import { Component, Input, Output, EventEmitter, ViewChild, AfterViewInit, OnDestroy, ContentChildren, QueryList } from '@angular/core';\r\nimport { BehaviorSubject, Observable, Subject, Subscription } from 'rxjs';\r\nimport { map, startWith, switchMap } from 'rxjs/operators';\r\nimport * as uuid from 'uuid';\r\nimport * as hash from 'object-hash';\r\nimport { DeviceDetectorService } from 'ngx-device-detector';\r\nimport { SdFilterDefDirective } from './directives/sd-filter-def.directive';\r\nimport { Filter, SdFilterInformation, FilterObject, SdFilterOption, SdQuickFilter } from './filter.model';\r\nimport { SdFilterService } from './filter.service';\r\nimport { SdSetting, SdSettingService } from '@sd-angular/core/setting';\r\nimport { SdCacheService } from '@sd-angular/core/cache';\r\n\r\n@Component({\r\n selector: 'sd-filter',\r\n templateUrl: './filter.component.html',\r\n styleUrls: ['./filter.component.scss']\r\n})\r\nexport class SdFilter implements AfterViewInit, OnDestroy {\r\n #prefix = '61d22e8e-eee8-4aad-8e1c-044a532fea91';\r\n setting: SdSetting<SdFilterInformation>;\r\n filterOption: SdFilterOption;\r\n @Input('option') set _filterOption(option: SdFilterOption) {\r\n console.log(option);\r\n if (option) {\r\n this.filterOption = option;\r\n this.#filterOptionChanges.next(option);\r\n }\r\n }\r\n #filterOptionChanges = new BehaviorSubject<SdFilterOption>(null);\r\n #subscription = new Subscription();\r\n @ContentChildren(SdFilterDefDirective) sdFilterDefs = new QueryList<SdFilterDefDirective>();\r\n isMobileOrTablet = false;\r\n filterChanges = new BehaviorSubject<FilterObject>({});\r\n filterInformation: Observable<SdFilterInformation>;\r\n information: SdFilterInformation;\r\n constructor(\r\n private deviceService: DeviceDetectorService,\r\n private settingService: SdSettingService,\r\n private filterService: SdFilterService) {\r\n this.isMobileOrTablet = !this.deviceService.isDesktop();\r\n }\r\n\r\n ngOnInit() {\r\n // if (!this.#key) {\r\n // this.setting = this.settingService.create<SdFilterInformation>(uuid.v4(), {\r\n // type: 'session',\r\n // default: {\r\n // filter: {},\r\n // visible: {},\r\n // quickFilters: [],\r\n // selectedQuickFilter: null\r\n // }\r\n // });\r\n // } else {\r\n // this.setting = this.settingService.create<SdFilterInformation>(this.#key, {\r\n // default: {\r\n // filter: {},\r\n // visible: {},\r\n // quickFilters: [],\r\n // selectedQuickFilter: null\r\n // }\r\n // });\r\n // }\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n this.#subscription.add(this.#filterOptionChanges.pipe(startWith(this.filterOption)).subscribe((filterOption) => {\r\n console.log(filterOption);\r\n if (!filterOption) {\r\n return;\r\n }\r\n const defaultInformation: SdFilterInformation = {\r\n filter: {},\r\n visible: {},\r\n quickFilters: filterOption?.quickFilter?.defaults \|\| [],\r\n selectedQuickFilter: filterOption?.quickFilter?.selectedDefault\r\n };\r\n if (!filterOption.key) {\r\n this.setting = this.settingService.create<SdFilterInformation>(uuid.v4(), {\r\n type: 'session',\r\n default: defaultInformation\r\n });\r\n } else {\r\n this.setting = this.settingService.create<SdFilterInformation>({\r\n prefix: this.#prefix,\r\n key: filterOption.key\r\n }, {\r\n default: defaultInformation\r\n });\r\n }\r\n this.information = this.setting.get();\r\n console.log(this.information);\r\n this.#subscription.add(this.setting.observer.subscribe(filterInformation => {\r\n this.information = filterInformation;\r\n this.#format(filterOption?.filters, this.information);\r\n }));\r\n }));\r\n }\r\n\r\n onFilter = (filter?: Filter) => {\r\n this.filterChanges.next({\r\n filter: { ...this.information.filter },\r\n filterDef: { ...this.information.filterDef },\r\n });\r\n this.setting.set(this.information);\r\n }\r\n\r\n onClear = () => {\r\n this.information.filter = {};\r\n this.information.filterDef = {};\r\n this.onFilter();\r\n }\r\n\r\n #format = (filters: Filter[], information: SdFilterInformation) => {\r\n for (const filter of filters) {\r\n if (filter.type === 'daterange') {\r\n information.filter[filter.field] = {\r\n from: information.filter[filter.field]?.from ?? undefined,\r\n to: information.filter[filter.field]?.to ?? undefined\r\n };\r\n } else {\r\n information.filter[filter.field] = information.filter[filter.field] ?? undefined;\r\n }\r\n }\r\n }\r\n\r\n #firstLoad = (filters: Filter[], information: SdFilterInformation) => {\r\n if (information.selectedQuickFilter && information.quickFilters.some(e => e.code === information.selectedQuickFilter)) {\r\n const selected = information.quickFilters.find(e => e.code === information.selectedQuickFilter);\r\n information.filter = { ...selected.filter };\r\n information.filterDef = { ...selected.filterDef };\r\n this.#format(filters, information);\r\n } else {\r\n for (const filter of filters) {\r\n if (filter.type === 'daterange') {\r\n information.filter[filter.field] = {\r\n from: information.filter[filter.field]?.from ?? filter.default?.from ?? undefined,\r\n to: information.filter[filter.field]?.to ?? filter.default?.to ?? undefined\r\n };\r\n } else {\r\n information.filter[filter.field] = information.filter[filter.field] ?? filter.default ?? undefined;\r\n }\r\n }\r\n }\r\n }\r\n\r\n ngOnDestroy() {\r\n this.#subscription.unsubscribe();\r\n }\r\n\r\n setFilter = (args: {\r\n filter: any,\r\n filterDef: any\r\n }) => {\r\n const { filter, filterDef } = args;\r\n this.information = {\r\n ...this.information,\r\n filter: { ...filter },\r\n filterDef: { ...filterDef }\r\n };\r\n }\r\n}\r\n","import { Pipe, PipeTransform } from '@angular/core';\r\nimport { ValuesLocalFilter } from '../filter.model';\r\n\r\n@Pipe({\r\n name: 'sdValuesLocal'\r\n})\r\nexport class SdValuesLocalPipe implements PipeTransform {\r\n transform = async (filterValues: ValuesLocalFilter): Promise<any[]> => {\r\n if(typeof(filterValues?.option?.items) === 'function') {\r\n return await filterValues?.option?.items();\r\n }\r\n return filterValues?.option?.items \|\| [];\r\n }\r\n}\r\n","import { Pipe, PipeTransform } from '@angular/core';\r\nimport { ValuesLocalFilter, ValuesServerFilter } from '../filter.model';\r\n\r\n@Pipe({\r\n name: 'sdValuesServer'\r\n})\r\nexport class SdValuesServerPipe implements PipeTransform {\r\n transform = (filterValues: ValuesServerFilter): any[] \| ((searchText: string \| string[], isFormValue?: boolean) => Promise<any[]>) => {\r\n if(typeof(filterValues?.option?.items) === 'function') {\r\n return filterValues?.option?.items;\r\n }\r\n return filterValues?.option?.items \|\| [];\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { SdCommonModule } from '@sd-angular/core/common';\r\nimport { SdFilterDefDirective } from './directives/sd-filter-def.directive';\r\nimport { SdFilter } from './filter.component';\r\nimport { SdFormModule } from '@sd-angular/core/form';\r\nimport { SdValuesLocalPipe } from './pipes/values-local.pipe';\r\nimport { SdValuesServerPipe } from './pipes/values-server.pipe';\r\nimport { SdFilterService } from './filter.service';\r\nimport { MatButtonModule } from '@angular/material/button';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n MatFormFieldModule,\r\n MatInputModule,\r\n MatIconModule,\r\n MatTooltipModule,\r\n MatButtonModule,\r\n SdTranslateModule,\r\n SdCommonModule,\r\n SdFormModule\r\n ],\r\n declarations: [\r\n SdFilter,\r\n SdFilterDefDirective,\r\n SdValuesLocalPipe,\r\n SdValuesServerPipe\r\n ],\r\n providers: [\r\n SdFilterService\r\n ],\r\n exports: [\r\n SdCommonModule,\r\n SdFilterDefDirective,\r\n SdFilter\r\n ]\r\n})\r\nexport class SdFilterModule { }\r\n","/\r\n Public API Surface of superdev-angular-core\r\n /\r\n\r\nexport from './lib/filter.module';\r\nexport * from './lib/directives/sd-filter-def.directive';\r\nexport * from './lib/filter.model';\r\nexport * from './lib/filter.component';","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n\nexport {SdFilterService as ɵa} from './src/lib/filter.service';\nexport {SdValuesLocalPipe as ɵb} from './src/lib/pipes/values-local.pipe';\nexport {SdValuesServerPipe as ɵc} from './src/lib/pipes/values-server.pipe';"],"names":["_prefix","uuid.v4"],"mappings":"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"}

package/fesm2015/sd-angular-core-grid-material.js CHANGED Viewed

@@ -179,7 +179,7 @@ class SdPopupFilter {
 SdPopupFilter.decorators = [
     { type: Component, args: [{
                 selector: 'sd-popup-filter',
-                template: "<sd-modal width=\"500px\" [title]=\"'Filter' | sdTranslate\" #modal>\r\n  <sd-modal-body class=\"c-popup-filter\">\r\n    <ng-container *ngFor=\"let column of columns | sdFilterColumn\">\r\n      <div class=\"d-flex align-items-baseline\">\r\n        <ng-container>\r\n          <div *sdDesktop class=\"c-checkable\">\r\n            <mat-slide-toggle [(ngModel)]=\"inlineColumn[column.field]\" color=\"primary\"></mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class=\"c-filterable\">\r\n          <sd-input *ngIf=\"column.type === 'string'\" [label]=\"column.title\" type=\"text\"\r\n            [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-input>\r\n          <sd-input *ngIf=\"column.type === 'number'\" [label]=\"column.title\" type=\" number\"\r\n            [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-input>\r\n          <sd-select *ngIf=\"column.type === 'bool'\" [label]=\"column.title\" [items]=\"[{value:'1',display:column.trueValue || 'True' },\r\n              {value:'0',display:column.falseValue || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n            [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-select>\r\n          <sd-select *ngIf=\"column.type === 'values' && !column?.editor?.autocomplete\" [label]=\"column.title\"\r\n            [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n            [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-select>\r\n          <sd-autocomplete *ngIf=\"column.type === 'values' && column?.editor?.autocomplete\" [label]=\"column.title\"\r\n            [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n            [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-autocomplete>\r\n          <sd-date-time *ngIf=\"column.type ==='date' || column.type==='datetime' ||\r\n              column.type==='time'\" [label]=\"column.title\" [(model)]=\" columnFilter[column.field]\" type=\"date\" appearance=\"outline\">\r\n          </sd-date-time>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal\">\r\n      <div class=\"d-flex align-items-baseline\">\r\n        <ng-container>\r\n          <div *sdDesktop class=\"c-checkable\">\r\n            <mat-slide-toggle [(ngModel)]=\"inlineExternal[item.field]\" color=\"primary\"></mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class=\"c-filterable\">\r\n          <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'string'\" type=\"text\"\r\n            [(model)]=\"externalFilter[item.field]\" appearance=\"outline\">\r\n          </sd-input>\r\n          <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'number'\" type=\"number\"\r\n            [(model)]=\"externalFilter[item.field]\" appearance=\"outline\">\r\n          </sd-input>\r\n          <sd-select [label]=\"item.title\" *ngIf=\"item.type === 'bool'\" [items]=\"[{value:'1',display:item.option?.displayOnTrue || 'True' },\r\n          {value:'0',display:item.option?.displayOnFalse || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n            [(model)]=\"externalFilter[item.field]\" appearance=\"outline\">\r\n          </sd-select>\r\n          <ng-container *ngIf=\"item.type === 'values'\">\r\n            <sd-select *ngIf=\"item.option?.selection === 'MULTIPLE'\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n              [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n              [(model)]=\"externalFilter[item.field]\" appearance=\"outline\" multiple>\r\n            </sd-select>\r\n            <sd-autocomplete *ngIf=\"item.option?.selection === 'AUTOCOMPLETE'\" [label]=\"item.title\"\r\n              [items]=\"item.option.items\" [valueField]=\"item.option.valueField\"\r\n              [displayField]=\"item.option.displayField\" appearance=\"outline\" [(model)]=\"externalFilter[item.field]\">\r\n            </sd-autocomplete>\r\n            <sd-select *ngIf=\"item.option?.selection === 'MULTIPLEAUTOCOMPLETE'\" [label]=\"item.title\"\r\n              [items]=\"item.option.items\" [valueField]=\"item.option.valueField\"\r\n              [displayField]=\"item.option.displayField\" appearance=\"outline\" [(model)]=\"externalFilter[item.field]\" filtered=\"true\" multiple>\r\n            </sd-select>\r\n            <sd-select *ngIf=\"!item.option?.selection\" [label]=\"item.title\" [items]=\"item.values\"\r\n              [items]=\"item.option.items\" [valueField]=\"item.option.valueField\"\r\n              [displayField]=\"item.option.displayField\" appearance=\"outline\" [(model)]=\"externalFilter[item.field]\">\r\n            </sd-select>\r\n          </ng-container>\r\n          <sd-date-time [label]=\"item.title\" *ngIf=\"item.type ==='date' || item.type === 'datetime'\" [(model)]=\"externalFilter[item.field]\"\r\n            [type]=\"item.type\" appearance=\"outline\">\r\n          </sd-date-time>\r\n          <sd-date-range [label]=\"item.title\" *ngIf=\"item.type ==='daterange' && externalFilter[item.field]\"\r\n            [(from)]=\"externalFilter[item.field].from\" [(to)]=\"externalFilter[item.field].to\" [min]=\"item.minDate\"\r\n            [max]=\"item.maxDate\" appearance=\"outline\">\r\n          </sd-date-range>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngFor=\"let filter of filterDefs\">\r\n      <div class=\"d-flex align-items-baseline\">\r\n        <ng-container>\r\n          <div *sdDesktop class=\"c-checkable\">\r\n            <mat-slide-toggle [(ngModel)]=\"inlineFilterDef[filter.sdMaterialFilterDef]\" color=\"primary\">\r\n            </mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class=\"c-filterable\">\r\n          <ng-container *ngTemplateOutlet=\"filter.templateRef;context:{filterDef:filterDef}\">\r\n          </ng-container>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n  </sd-modal-body>\r\n  <sd-modal-footer *sdDesktop>\r\n    <sd-button class=\"mr-auto\" (action)=\"onClear()\" icon=\"clear\" [title]=\"'Clear filter' | sdTranslate\" size=\"sm\">\r\n    </sd-button>\r\n    <sd-button (action)=\"onApply()\" icon=\"done\" [title]=\"'Apply' | sdTranslate\" color=\"primary\" size=\"sm\"></sd-button>\r\n  </sd-modal-footer>\r\n  <sd-modal-footer *sdMobileTablet>\r\n    <sd-button style=\"flex: 1; padding-right: 5px;\" (action)=\"onClear()\" icon=\"clear\"\r\n      [title]=\"'Clear filter' | sdTranslate\" width=\"100%\" size=\"sm\"></sd-button>\r\n    <sd-button style=\"flex: 1; padding-left: 5px;\" (action)=\"onApply()\" icon=\"done\" [title]=\"'Apply' | sdTranslate\"\r\n      color=\"primary\" width=\"100%\" size=\"sm\"></sd-button>\r\n  </sd-modal-footer>\r\n</sd-modal>",
+                template: "<sd-modal width=\"500px\" [title]=\"'Filter' | sdTranslate\" #modal>\r\n  <sd-modal-body class=\"c-popup-filter\">\r\n    <ng-container *ngFor=\"let column of columns | sdFilterColumn\">\r\n      <div class=\"d-flex align-items-baseline\">\r\n        <ng-container>\r\n          <div *sdDesktop class=\"c-checkable\">\r\n            <mat-slide-toggle [(ngModel)]=\"inlineColumn[column.field]\" color=\"primary\"></mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class=\"c-filterable\">\r\n          <sd-input *ngIf=\"column.type === 'string'\" [label]=\"column.title\" type=\"text\"\r\n            [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-input>\r\n          <sd-input *ngIf=\"column.type === 'number'\" [label]=\"column.title\" type=\" number\"\r\n            [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-input>\r\n          <sd-select *ngIf=\"column.type === 'bool'\" [label]=\"column.title\" [items]=\"[{value:'1',display:column.trueValue || 'True' },\r\n              {value:'0',display:column.falseValue || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n            [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-select>\r\n          <sd-select *ngIf=\"column.type === 'values' && !column?.editor?.autocomplete\" [label]=\"column.title\"\r\n            [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n            [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-select>\r\n          <sd-autocomplete *ngIf=\"column.type === 'values' && column?.editor?.autocomplete\" [label]=\"column.title\"\r\n            [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n            [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" appearance=\"outline\">\r\n          </sd-autocomplete>\r\n          <sd-date-time *ngIf=\"column.type ==='date' || column.type==='datetime' ||\r\n              column.type==='time'\" [label]=\"column.title\" [(model)]=\" columnFilter[column.field]\" type=\"date\"\r\n            appearance=\"outline\">\r\n          </sd-date-time>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal\">\r\n      <div class=\"d-flex align-items-baseline\">\r\n        <ng-container>\r\n          <div *sdDesktop class=\"c-checkable\">\r\n            <mat-slide-toggle [(ngModel)]=\"inlineExternal[item.field]\" color=\"primary\"></mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class=\"c-filterable\">\r\n          <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'string'\" type=\"text\"\r\n            [(model)]=\"externalFilter[item.field]\" appearance=\"outline\">\r\n          </sd-input>\r\n          <sd-input-number [label]=\"item.title\" *ngIf=\"item.type === 'number'\" [(model)]=\"externalFilter[item.field]\"\r\n            appearance=\"outline\">\r\n          </sd-input-number>\r\n          <sd-select [label]=\"item.title\" *ngIf=\"item.type === 'bool'\" [items]=\"[{value:'1',display:item.option?.displayOnTrue || 'True' },\r\n          {value:'0',display:item.option?.displayOnFalse || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n            [(model)]=\"externalFilter[item.field]\" appearance=\"outline\">\r\n          </sd-select>\r\n          <ng-container *ngIf=\"item.type === 'values'\">\r\n            <sd-select *ngIf=\"item.option?.selection === 'MULTIPLE'\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n              [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n              [(model)]=\"externalFilter[item.field]\" appearance=\"outline\" multiple>\r\n            </sd-select>\r\n            <sd-autocomplete *ngIf=\"item.option?.selection === 'AUTOCOMPLETE'\" [label]=\"item.title\"\r\n              [items]=\"item.option.items\" [valueField]=\"item.option.valueField\"\r\n              [displayField]=\"item.option.displayField\" appearance=\"outline\" [(model)]=\"externalFilter[item.field]\">\r\n            </sd-autocomplete>\r\n            <sd-select *ngIf=\"item.option?.selection === 'MULTIPLEAUTOCOMPLETE'\" [label]=\"item.title\"\r\n              [items]=\"item.option.items\" [valueField]=\"item.option.valueField\"\r\n              [displayField]=\"item.option.displayField\" appearance=\"outline\" [(model)]=\"externalFilter[item.field]\"\r\n              filtered=\"true\" multiple>\r\n            </sd-select>\r\n            <sd-select *ngIf=\"!item.option?.selection\" [label]=\"item.title\" [items]=\"item.values\"\r\n              [items]=\"item.option.items\" [valueField]=\"item.option.valueField\"\r\n              [displayField]=\"item.option.displayField\" appearance=\"outline\" [(model)]=\"externalFilter[item.field]\">\r\n            </sd-select>\r\n          </ng-container>\r\n          <sd-date-time [label]=\"item.title\" *ngIf=\"item.type ==='date' || item.type === 'datetime'\"\r\n            [(model)]=\"externalFilter[item.field]\" [type]=\"item.type\" appearance=\"outline\">\r\n          </sd-date-time>\r\n          <sd-date-range [label]=\"item.title\" *ngIf=\"item.type ==='daterange' && externalFilter[item.field]\"\r\n            [(from)]=\"externalFilter[item.field].from\" [(to)]=\"externalFilter[item.field].to\" [min]=\"item.minDate\"\r\n            [max]=\"item.maxDate\" appearance=\"outline\">\r\n          </sd-date-range>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngFor=\"let filter of filterDefs\">\r\n      <div class=\"d-flex align-items-baseline\">\r\n        <ng-container>\r\n          <div *sdDesktop class=\"c-checkable\">\r\n            <mat-slide-toggle [(ngModel)]=\"inlineFilterDef[filter.sdMaterialFilterDef]\" color=\"primary\">\r\n            </mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class=\"c-filterable\">\r\n          <ng-container *ngTemplateOutlet=\"filter.templateRef;context:{filterDef:filterDef}\">\r\n          </ng-container>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n  </sd-modal-body>\r\n  <sd-modal-footer *sdDesktop>\r\n    <sd-button class=\"mr-auto\" (action)=\"onClear()\" icon=\"clear\" [title]=\"'Clear filter' | sdTranslate\" size=\"sm\">\r\n    </sd-button>\r\n    <sd-button (action)=\"onApply()\" icon=\"done\" [title]=\"'Apply' | sdTranslate\" color=\"primary\" size=\"sm\"></sd-button>\r\n  </sd-modal-footer>\r\n  <sd-modal-footer *sdMobileTablet>\r\n    <sd-button style=\"flex: 1; padding-right: 5px;\" (action)=\"onClear()\" icon=\"clear\"\r\n      [title]=\"'Clear filter' | sdTranslate\" width=\"100%\" size=\"sm\"></sd-button>\r\n    <sd-button style=\"flex: 1; padding-left: 5px;\" (action)=\"onApply()\" icon=\"done\" [title]=\"'Apply' | sdTranslate\"\r\n      color=\"primary\" width=\"100%\" size=\"sm\"></sd-button>\r\n  </sd-modal-footer>\r\n</sd-modal>",
                 styles: [".c-checkable{width:50px}.c-filterable{flex:1}::ng-deep sd-modal-body.c-popup-filter .mat-form-field-wrapper{padding-bottom:0}"]
             },] }
 ];
@@ -422,7 +422,7 @@ _filterOptionChanges = new WeakMap(), _subscription = new WeakMap(), _loadDefaul
 SdGridFilter.decorators = [
     { type: Component, args: [{
                 selector: 'sd-grid-filter',
-                template: "<ng-container *ngIf=\"isVisible\">\r\n  <div *ngIf=\"!isMobileOrTablet && ((columns?.length && !filter?.inlineColumn) || externalFilters?.length || filterDefs?.length)\"\r\n    class=\"row mx-0 pb-10\">\r\n    <ng-container *ngIf=\"filter?.sorts?.length\">\r\n      <ng-container *ngFor=\"let field of filter?.sorts\">\r\n        <ng-container *ngIf=\"columns?.length && !filter?.inlineColumn\">\r\n          <ng-container *ngFor=\"let item of columns | sdFilterColumn:field\">\r\n            <ng-container *ngTemplateOutlet=\"filterColumn; context: {item: item}\"></ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"externalFilters?.length\">\r\n          <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal:field\">\r\n            <ng-container *ngTemplateOutlet=\"filterExternal; context: {item: item}\"></ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let item of filterDefs\">\r\n          <div *ngIf=\"inlineFilterDef[item.sdMaterialFilterDef] && item.sdMaterialFilterDef === field\"\r\n            class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n            <ng-container *ngTemplateOutlet=\"item.templateRef;context:{filterDef:filterDef, isInline: true}\">\r\n            </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"!filter?.sorts?.length\">\r\n      <ng-container *ngIf=\"columns?.length && !filter?.inlineColumn\">\r\n        <ng-container *ngFor=\"let item of columns | sdFilterColumn\">\r\n          <ng-container *ngTemplateOutlet=\"filterColumn; context: {item: item}\"></ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"externalFilters?.length\">\r\n        <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal\">\r\n          <ng-container *ngTemplateOutlet=\"filterExternal; context: {item: item}\"></ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-container *ngFor=\"let item of filterDefs\">\r\n        <div *ngIf=\"inlineFilterDef[item.sdMaterialFilterDef]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n          <ng-container *ngTemplateOutlet=\"item.templateRef;context:{filterDef:filterDef, isInline: true}\">\r\n          </ng-container>\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n  <ng-template #filterColumn let-item=\"item\">\r\n    <div *ngIf=\"inlineColumn[item.field]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n      <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'string'\" type=\"text\" [(model)]=\"columnFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input>\r\n      <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'number'\" type=\"number\" [(model)]=\"columnFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input>\r\n      <sd-select [label]=\"item.title\" *ngIf=\"item.type === 'bool'\" [items]=\"[{value:'1',display:item.option?.displayOnTrue || 'True' },\r\n        {value:'0',display:item.option?.displayOnFalse || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n        [(model)]=\"columnFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-select>\r\n      <sd-select *ngIf=\"item.type === 'values' && item?.option?.selection !== 'AUTOCOMPLETE'\"\r\n        [items]=\"item.option?.items\" [valueField]=\"item.option?.valueField\"\r\n        [displayField]=\"item.option.displayField\" [(model)]=\"columnFilter[item.field]\" (sdChange)=\"onFilter(item)\"\r\n        [disabled]=\"item.filter?.disabled\"\r\n        [multiple]=\"item?.option?.selection === 'MULTIPLE' || item?.item?.selection === 'MULTIPLEAUTOCOMPLETE'\"\r\n        [filtered]=\"item?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\" appearance=\"outline\">\r\n      </sd-select>\r\n      <sd-autocomplete *ngIf=\"item.type === 'values' && item?.option?.selection === 'AUTOCOMPLETE'\"\r\n        [items]=\"item.option?.items\" [valueField]=\"item.option?.valueField\"\r\n        [displayField]=\"item.option?.displayField\" [(model)]=\"columnFilter[item.field]\" (sdChange)=\"onFilter(item)\"\r\n        [disabled]=\"item.filter?.disabled\" appearance=\"outline\">\r\n      </sd-autocomplete>\r\n      <sd-date-time *ngIf=\"item.type === 'date' || item.type === 'datetime' || item.type === 'time'\"\r\n        [label]=\"item.title\" [(model)]=\"columnFilter[item.field]\" [type]=\"item.type\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-date-time>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template #filterExternal let-item=\"item\">\r\n    <div *ngIf=\"inlineExternal[item.field]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n      <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'string'\" type=\"text\" [(model)]=\"externalFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input>\r\n      <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'number'\" type=\"number\" [(model)]=\"externalFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input>\r\n      <sd-select [label]=\"item.title\" *ngIf=\"item.type === 'bool'\" [items]=\"[{value:'1',display:item.option?.displayOnTrue || 'True' },\r\n        {value:'0',display:item.option?.displayOnFalse || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n        [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-select>\r\n      <ng-container *ngIf=\"item.type === 'values' && item.option\">\r\n        <sd-select *ngIf=\"item.option?.selection === 'MULTIPLE'\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n          [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" [selectAll]=\"item.option.selectAll\" appearance=\"outline\" multiple>\r\n        </sd-select>\r\n        <sd-autocomplete *ngIf=\"item.option?.selection === 'AUTOCOMPLETE'\" [label]=\"item.title\"\r\n          [items]=\"item.option.items\" [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-autocomplete>\r\n        <sd-select *ngIf=\"item.option?.selection === 'MULTIPLEAUTOCOMPLETE'\" [label]=\"item.title\"\r\n          [items]=\"item.option.items\" [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" filtered=\"true\" appearance=\"outline\" multiple>\r\n        </sd-select>\r\n        <sd-select *ngIf=\"!item.option?.selection\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n          [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-select>\r\n      </ng-container>\r\n      <sd-date-time [label]=\"item.title\" *ngIf=\"item.type ==='date' || item.type ==='datetime'\"\r\n        [(model)]=\"externalFilter[item.field]\" [type]=\"item.type\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-date-time>\r\n      <sd-date-range [label]=\"item.title\" *ngIf=\"item.type ==='daterange' && externalFilter[item.field]\"\r\n        [(from)]=\"externalFilter[item.field].from\" [(to)]=\"externalFilter[item.field].to\" [min]=\"item.minDate\"\r\n        [max]=\"item.maxDate\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-date-range>\r\n    </div>\r\n  </ng-template>\r\n  <sd-popup-filter [columns]=\"columns\" [externalFilters]=\"externalFilters\" (changeFilter)=\"onChangeFilter($event)\"\r\n    (clearFilter)=\"onReset()\" [filterDefs]=\"filterDefs\">\r\n  </sd-popup-filter>\r\n</ng-container>",
+                template: "<ng-container *ngIf=\"isVisible\">\r\n  <div *ngIf=\"!isMobileOrTablet && ((columns?.length && !filter?.inlineColumn) || externalFilters?.length || filterDefs?.length)\"\r\n    class=\"row mx-0 pb-10\">\r\n    <ng-container *ngIf=\"filter?.sorts?.length\">\r\n      <ng-container *ngFor=\"let field of filter?.sorts\">\r\n        <ng-container *ngIf=\"columns?.length && !filter?.inlineColumn\">\r\n          <ng-container *ngFor=\"let item of columns | sdFilterColumn:field\">\r\n            <ng-container *ngTemplateOutlet=\"filterColumn; context: {item: item}\"></ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"externalFilters?.length\">\r\n          <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal:field\">\r\n            <ng-container *ngTemplateOutlet=\"filterExternal; context: {item: item}\"></ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let item of filterDefs\">\r\n          <div *ngIf=\"inlineFilterDef[item.sdMaterialFilterDef] && item.sdMaterialFilterDef === field\"\r\n            class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n            <ng-container *ngTemplateOutlet=\"item.templateRef;context:{filterDef:filterDef, isInline: true}\">\r\n            </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"!filter?.sorts?.length\">\r\n      <ng-container *ngIf=\"columns?.length && !filter?.inlineColumn\">\r\n        <ng-container *ngFor=\"let item of columns | sdFilterColumn\">\r\n          <ng-container *ngTemplateOutlet=\"filterColumn; context: {item: item}\"></ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"externalFilters?.length\">\r\n        <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal\">\r\n          <ng-container *ngTemplateOutlet=\"filterExternal; context: {item: item}\"></ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-container *ngFor=\"let item of filterDefs\">\r\n        <div *ngIf=\"inlineFilterDef[item.sdMaterialFilterDef]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n          <ng-container *ngTemplateOutlet=\"item.templateRef;context:{filterDef:filterDef, isInline: true}\">\r\n          </ng-container>\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n  <ng-template #filterColumn let-item=\"item\">\r\n    <div *ngIf=\"inlineColumn[item.field]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n      <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'string'\" type=\"text\" [(model)]=\"columnFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input>\r\n      <sd-input-number [label]=\"item.title\" *ngIf=\"item.type === 'number'\" [(model)]=\"columnFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input-number>\r\n      <sd-select [label]=\"item.title\" *ngIf=\"item.type === 'bool'\" [items]=\"[{value:'1',display:item.option?.displayOnTrue || 'True' },\r\n        {value:'0',display:item.option?.displayOnFalse || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n        [(model)]=\"columnFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-select>\r\n      <sd-select *ngIf=\"item.type === 'values' && item?.option?.selection !== 'AUTOCOMPLETE'\"\r\n        [items]=\"item.option?.items\" [valueField]=\"item.option?.valueField\"\r\n        [displayField]=\"item.option.displayField\" [(model)]=\"columnFilter[item.field]\" (sdChange)=\"onFilter(item)\"\r\n        [disabled]=\"item.filter?.disabled\"\r\n        [multiple]=\"item?.option?.selection === 'MULTIPLE' || item?.item?.selection === 'MULTIPLEAUTOCOMPLETE'\"\r\n        [filtered]=\"item?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\" appearance=\"outline\">\r\n      </sd-select>\r\n      <sd-autocomplete *ngIf=\"item.type === 'values' && item?.option?.selection === 'AUTOCOMPLETE'\"\r\n        [items]=\"item.option?.items\" [valueField]=\"item.option?.valueField\"\r\n        [displayField]=\"item.option?.displayField\" [(model)]=\"columnFilter[item.field]\" (sdChange)=\"onFilter(item)\"\r\n        [disabled]=\"item.filter?.disabled\" appearance=\"outline\">\r\n      </sd-autocomplete>\r\n      <sd-date-time *ngIf=\"item.type === 'date' || item.type === 'datetime' || item.type === 'time'\"\r\n        [label]=\"item.title\" [(model)]=\"columnFilter[item.field]\" [type]=\"item.type\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-date-time>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template #filterExternal let-item=\"item\">\r\n    <div *ngIf=\"inlineExternal[item.field]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n      <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'string'\" type=\"text\" [(model)]=\"externalFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input>\r\n      <sd-input-number [label]=\"item.title\" *ngIf=\"item.type === 'number'\" [(model)]=\"externalFilter[item.field]\"\r\n        (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-input-number>\r\n      <sd-select [label]=\"item.title\" *ngIf=\"item.type === 'bool'\" [items]=\"[{value:'1',display:item.option?.displayOnTrue || 'True' },\r\n        {value:'0',display:item.option?.displayOnFalse || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n        [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-select>\r\n      <ng-container *ngIf=\"item.type === 'values' && item.option\">\r\n        <sd-select *ngIf=\"item.option?.selection === 'MULTIPLE'\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n          [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" [selectAll]=\"item.option.selectAll\" appearance=\"outline\" multiple>\r\n        </sd-select>\r\n        <sd-autocomplete *ngIf=\"item.option?.selection === 'AUTOCOMPLETE'\" [label]=\"item.title\"\r\n          [items]=\"item.option.items\" [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-autocomplete>\r\n        <sd-select *ngIf=\"item.option?.selection === 'MULTIPLEAUTOCOMPLETE'\" [label]=\"item.title\"\r\n          [items]=\"item.option.items\" [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" filtered=\"true\" appearance=\"outline\" multiple>\r\n        </sd-select>\r\n        <sd-select *ngIf=\"!item.option?.selection\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n          [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-select>\r\n      </ng-container>\r\n      <sd-date-time [label]=\"item.title\" *ngIf=\"item.type ==='date' || item.type ==='datetime'\"\r\n        [(model)]=\"externalFilter[item.field]\" [type]=\"item.type\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-date-time>\r\n      <sd-date-range [label]=\"item.title\" *ngIf=\"item.type ==='daterange' && externalFilter[item.field]\"\r\n        [(from)]=\"externalFilter[item.field].from\" [(to)]=\"externalFilter[item.field].to\" [min]=\"item.minDate\"\r\n        [max]=\"item.maxDate\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n      </sd-date-range>\r\n    </div>\r\n  </ng-template>\r\n  <sd-popup-filter [columns]=\"columns\" [externalFilters]=\"externalFilters\" (changeFilter)=\"onChangeFilter($event)\"\r\n    (clearFilter)=\"onReset()\" [filterDefs]=\"filterDefs\">\r\n  </sd-popup-filter>\r\n</ng-container>",
                 styles: [":host{display:block;padding-left:0;padding-right:0}:host ::ng-deep .mat-form-field-wrapper{padding-bottom:0}"]
             },] }
 ];
@@ -2830,7 +2830,7 @@ _subscription$2 = new WeakMap();
 SdDynamicColumn.decorators = [
     { type: Component, args: [{
                 selector: 'sd-dynamic-column',
-                template: "<sd-side-drawer width=\"400px\">\r\n  <div sdTitle>{{'Manage dynamic column' | sdTranslate}}</div>\r\n  <ng-container sdBody>\r\n    <ng-container *ngIf=\"!isDetail\">\r\n      <ng-container *ngIf=\"systemColumns\">\r\n        <div *ngFor=\"let column of systemColumns\" (click)=\"onDetail(column)\">\r\n          {{column.title}}\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"columns\">\r\n        <div *ngFor=\"let column of columns\" (click)=\"onDetail(column)\">\r\n          {{column.title}}\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"isDetail\">\r\n      <sd-select [form]=\"form\" [label]=\"'Apply for' | sdTranslate\" [(model)]=\"detail.isSystem\"\r\n        [items]=\"[{code: true, name: 'All users'},{code: false, name: 'Only me'}]\" [disabled]=\"!!detail.id\" required></sd-select>\r\n      <sd-input [form]=\"form\" [label]=\"'Column field' | sdTranslate\" [(model)]=\"detail.field\" [disabled]=\"!!detail.id\"\r\n        required></sd-input>\r\n      <sd-input [form]=\"form\" [label]=\"'Column title' | sdTranslate\" [(model)]=\"detail.title\" required></sd-input>\r\n      <sd-input [form]=\"form\" [label]=\"'Column width' | sdTranslate\" [(model)]=\"detail.width\" type=\"number\" required>\r\n        <ng-template sdInputSuffix>px</ng-template>\r\n      </sd-input>\r\n      <sd-select [form]=\"form\" [label]=\"'Column type' | sdTranslate\" [(model)]=\"detail.type\" [items]=\"columnTypes\"\r\n        [disabled]=\"!!detail.id\" required></sd-select>\r\n      <sd-select *ngIf=\"detail.type === 'children' || detail.type === 'children-col'\" [form]=\"form\"\r\n        [label]=\"'Column fields' | sdTranslate\" [(model)]=\"detail.fields\" [items]=\"originColumns\" valueField=\"field\"\r\n        displayField=\"title\" multiple></sd-select>\r\n      <sd-select [form]=\"form\" [label]=\"'Use template' | sdTranslate\" [(model)]=\"detail.useTemplate\"\r\n        [items]=\"[{code: true, name: 'Yes'},{code: false, name: 'No'}]\" required></sd-select>\r\n      <sd-editor *ngIf=\"detail.useTemplate\" [form]=\"form\" [label]=\"'Html template' | sdTranslate\" [(model)]=\"detail.template\">\r\n      </sd-editor>\r\n    </ng-container>\r\n  </ng-container>\r\n  <div class=\"d-flex align-items-center justify-content-end\" sdFooter>\r\n    <sd-button [title]=\"'Close' | sdTranslate\" (action)=\"sideDrawer.close()\"> </sd-button>\r\n    <sd-button *ngIf=\"!isDetail\" [title]=\"'Create column' | sdTranslate\" color=\"primary\" class=\"mx-8\"\r\n      (action)=\"onDetail()\">\r\n    </sd-button>\r\n    <sd-button *ngIf=\"isDetail\" [title]=\"'Save' | sdTranslate\" color=\"success\" class=\"mx-8\" (action)=\"onSave()\">\r\n    </sd-button>\r\n  </div>\r\n</sd-side-drawer>",
+                template: "<sd-side-drawer width=\"400px\">\r\n  <div sdTitle>{{'Manage dynamic column' | sdTranslate}}</div>\r\n  <ng-container sdBody>\r\n    <ng-container *ngIf=\"!isDetail\">\r\n      <ng-container *ngIf=\"systemColumns\">\r\n        <div *ngFor=\"let column of systemColumns\" (click)=\"onDetail(column)\">\r\n          {{column.title}}\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"columns\">\r\n        <div *ngFor=\"let column of columns\" (click)=\"onDetail(column)\">\r\n          {{column.title}}\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"isDetail\">\r\n      <sd-select [form]=\"form\" [label]=\"'Apply for' | sdTranslate\" [(model)]=\"detail.isSystem\"\r\n        [items]=\"[{code: true, name: 'All users'},{code: false, name: 'Only me'}]\" [disabled]=\"!!detail.id\" required></sd-select>\r\n      <sd-input [form]=\"form\" [label]=\"'Column field' | sdTranslate\" [(model)]=\"detail.field\" [disabled]=\"!!detail.id\"\r\n        required></sd-input>\r\n      <sd-input [form]=\"form\" [label]=\"'Column title' | sdTranslate\" [(model)]=\"detail.title\" required></sd-input>\r\n      <sd-input-number [form]=\"form\" [label]=\"'Column width' | sdTranslate\" [(model)]=\"detail.width\" required>\r\n        <ng-template sdInputSuffix>px</ng-template>\r\n      </sd-input-number>\r\n      <sd-select [form]=\"form\" [label]=\"'Column type' | sdTranslate\" [(model)]=\"detail.type\" [items]=\"columnTypes\"\r\n        [disabled]=\"!!detail.id\" required></sd-select>\r\n      <sd-select *ngIf=\"detail.type === 'children' || detail.type === 'children-col'\" [form]=\"form\"\r\n        [label]=\"'Column fields' | sdTranslate\" [(model)]=\"detail.fields\" [items]=\"originColumns\" valueField=\"field\"\r\n        displayField=\"title\" multiple></sd-select>\r\n      <sd-select [form]=\"form\" [label]=\"'Use template' | sdTranslate\" [(model)]=\"detail.useTemplate\"\r\n        [items]=\"[{code: true, name: 'Yes'},{code: false, name: 'No'}]\" required></sd-select>\r\n      <sd-editor *ngIf=\"detail.useTemplate\" [form]=\"form\" [label]=\"'Html template' | sdTranslate\" [(model)]=\"detail.template\">\r\n      </sd-editor>\r\n    </ng-container>\r\n  </ng-container>\r\n  <div class=\"d-flex align-items-center justify-content-end\" sdFooter>\r\n    <sd-button [title]=\"'Close' | sdTranslate\" (action)=\"sideDrawer.close()\"> </sd-button>\r\n    <sd-button *ngIf=\"!isDetail\" [title]=\"'Create column' | sdTranslate\" color=\"primary\" class=\"mx-8\"\r\n      (action)=\"onDetail()\">\r\n    </sd-button>\r\n    <sd-button *ngIf=\"isDetail\" [title]=\"'Save' | sdTranslate\" color=\"success\" class=\"mx-8\" (action)=\"onSave()\">\r\n    </sd-button>\r\n  </div>\r\n</sd-side-drawer>",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [".c-table{overflow:auto;position:relative}.c-table table{width:100%}.c-table .c-th{color:#000;font-size:14px;font-weight:500;line-height:20px}.c-container{min-height:200px;position:relative}.c-handle{color:#ccc;cursor:move}"]
             },] }
@@ -3116,7 +3116,7 @@ class SdColumnInlineFilter {
 SdColumnInlineFilter.decorators = [
     { type: Component, args: [{
                 selector: 'sd-column-inline-filter',
-                template: "<div class=\"c-inline-column\">\r\n  <ng-container *ngIf=\"\r\n  column.type === 'string' ||\r\n  column.type === 'number' ||\r\n  column.type === 'bool' ||\r\n  column.type === 'values' ||\r\n  column.type === 'date' ||\r\n  column.type === 'datetime' ||\r\n  column.type === 'time';\r\n  else noFilter\">\r\n    <sd-input *ngIf=\"column.type === 'string'\" size=\"sm\" type=\"text\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input>\r\n    <sd-input *ngIf=\"column.type === 'number'\" size=\"sm\" type=\"number\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input>\r\n    <sd-select *ngIf=\"column.type === 'bool'\" size=\"sm\" [items]=\"[\r\n        { value: '1', display: column.option?.displayOnTrue || 'True' },\r\n        { value: '0', display: column.option?.displayOnFalse || 'False' }\r\n      ]\" valueField=\"value\" displayField=\"display\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n      <ng-template sdSelectDisplayDef let-item=\"item\">\r\n        <sd-badge *ngIf=\"item.value === '1'\" color=\"success\" [title]=\"column.option?.displayOnTrue || 'True'\">\r\n        </sd-badge>\r\n        <sd-badge *ngIf=\"item.value === '0'\" color=\"danger\" [title]=\"column.option?.displayOnFalse || 'False'\">\r\n        </sd-badge>\r\n      </ng-template>\r\n    </sd-select>\r\n    <sd-select *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection !== 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\" [multiple]=\"\r\n        column?.option?.selection === 'MULTIPLE' ||\r\n        column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\r\n      \" [filtered]=\"column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\">\r\n    </sd-select>\r\n    <sd-autocomplete *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection === 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-autocomplete>\r\n    <ng-container *ngIf=\"column.type === 'date' || column.type === 'datetime' || column.type === 'time'\">\r\n      <sd-date-range *ngIf=\"!column.option?.useFilterDate\" size=\"sm\" [(from)]=\"columnFilter[column.field].from\"\r\n        [(to)]=\"columnFilter[column.field].to\" (sdChange)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n      </sd-date-range>\r\n      <sd-date-time *ngIf=\"column.option?.useFilterDate\" size=\"sm\" [(model)]=\"columnFilter[column.field]\"\r\n        (sdChange)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n      </sd-date-time>\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #noFilter>\r\n    <sd-input type=\"text\" size=\"sm\" disabled> </sd-input>\r\n  </ng-template>\r\n</div>",
+                template: "<div class=\"c-inline-column\">\r\n  <ng-container *ngIf=\"\r\n  column.type === 'string' ||\r\n  column.type === 'number' ||\r\n  column.type === 'bool' ||\r\n  column.type === 'values' ||\r\n  column.type === 'date' ||\r\n  column.type === 'datetime' ||\r\n  column.type === 'time';\r\n  else noFilter\">\r\n    <sd-input *ngIf=\"column.type === 'string'\" size=\"sm\" type=\"text\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input>\r\n    <sd-input-number *ngIf=\"column.type === 'number'\" size=\"sm\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input-number>\r\n    <sd-select *ngIf=\"column.type === 'bool'\" size=\"sm\" [items]=\"[\r\n        { value: '1', display: column.option?.displayOnTrue || 'True' },\r\n        { value: '0', display: column.option?.displayOnFalse || 'False' }\r\n      ]\" valueField=\"value\" displayField=\"display\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n      <ng-template sdSelectDisplayDef let-item=\"item\">\r\n        <sd-badge *ngIf=\"item.value === '1'\" color=\"success\" [title]=\"column.option?.displayOnTrue || 'True'\">\r\n        </sd-badge>\r\n        <sd-badge *ngIf=\"item.value === '0'\" color=\"danger\" [title]=\"column.option?.displayOnFalse || 'False'\">\r\n        </sd-badge>\r\n      </ng-template>\r\n    </sd-select>\r\n    <sd-select *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection !== 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\" [multiple]=\"\r\n        column?.option?.selection === 'MULTIPLE' ||\r\n        column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\r\n      \" [filtered]=\"column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\">\r\n    </sd-select>\r\n    <sd-autocomplete *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection === 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-autocomplete>\r\n    <ng-container *ngIf=\"column.type === 'date' || column.type === 'datetime' || column.type === 'time'\">\r\n      <sd-date-range *ngIf=\"!column.option?.useFilterDate\" size=\"sm\" [(from)]=\"columnFilter[column.field].from\"\r\n        [(to)]=\"columnFilter[column.field].to\" (sdChange)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n      </sd-date-range>\r\n      <sd-date-time *ngIf=\"column.option?.useFilterDate\" size=\"sm\" [(model)]=\"columnFilter[column.field]\"\r\n        (sdChange)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n      </sd-date-time>\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #noFilter>\r\n    <sd-input type=\"text\" size=\"sm\" disabled> </sd-input>\r\n  </ng-template>\r\n</div>",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [":host ::ng-deep .c-inline-column .mat-form-field-wrapper{background-color:#fff;border-radius:8px;margin:8px 0 0!important;padding:0!important}"]
             },] }