@sd-angular/core 0.0.1007 → 0.0.1011

package/select/sd-angular-core-select.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":20,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":21,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":22,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":23,"character":4},{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelectModule","line":24,"character":4},{"__symbolic":"reference","module":"@angular/material/progress-spinner","name":"MatProgressSpinnerModule","line":25,"character":4},{"__symbolic":"reference","module":"@angular/material/checkbox","name":"MatCheckboxModule","line":26,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":27,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSelect"},{"__symbolic":"reference","name":"SdSelectDisplayDefDirective"}],"exports":[{"__symbolic":"reference","name":"SdSelect"},{"__symbolic":"reference","name":"SdSelectDisplayDefDirective"}],"providers":[]}]}],"members":{}},"SdSelect":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"sd-select","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":14,"character":19},"member":"OnPush"},"template":"<div class=\"d-flex align-items-center\">\r\n  <mat-form-field class=\"sd-md\" [ngClass]=\"{'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\"\r\n    appearance=\"outline\">\r\n    <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n    <mat-select #select [formControl]=\"formControl\" placeholder=\"{{placeholder || label}}\" multiple\r\n      (selectionChange)=\"onSelectionChange($event)\" disableOptionCentering=\"true\" panelClass=\"sd-select-panel\"\r\n      [ngClass]=\"{'sd-selected': !isRequired && (multiple ? formControl?.value?.length : formControl?.value)}\"\r\n      [required]=\"isRequired\" (openedChange)=\"onOpenChange($event)\" *ngIf=\"multiple\">\r\n      <mat-select-trigger>\r\n        {{display | async }}\r\n      </mat-select-trigger>\r\n      <mat-option *ngIf=\"filtered\" class=\"sd-filtered-input\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n        <mat-form-field class=\"sd-md\" appearance=\"outline\">\r\n          <mat-icon matPrefix>search</mat-icon>\r\n          <input #input placeholder=\"{{'Search' | sdTranslate}}\" matInput autocomplete=\"off\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"searchTerm$.next($event.target.value)\">\r\n        </mat-form-field>\r\n      </mat-option>\r\n      <ng-container *ngIf=\"multiple && selectAll\">\r\n        <mat-checkbox class=\"mat-option\" [(ngModel)]=\"allSelected\" [ngModelOptions]=\"{standalone: true}\"\r\n          (change)=\"onSelectAll()\">\r\n          Tất cả</mat-checkbox>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"valueField && displayField\">\r\n        <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item[valueField]\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item[displayField]\">\r\n          <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n            <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n            </ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n            {{ item[displayField] }}\r\n          </ng-container>\r\n        </mat-option>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"!valueField && !displayField\">\r\n        <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item\">\r\n          <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n            <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n            </ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n            {{ item }}\r\n          </ng-container>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-select>\r\n    <mat-select #select [formControl]=\"formControl\" placeholder=\"{{placeholder || label}}\"\r\n      (selectionChange)=\"onSelectionChange($event)\" disableOptionCentering=\"true\" panelClass=\"sd-select-panel\"\r\n      [ngClass]=\"{'sd-selected': !isRequired && formControl?.value}\" [required]=\"isRequired\"\r\n      (openedChange)=\"onOpenChange($event)\" *ngIf=\"!multiple\">\r\n      <mat-select-trigger>\r\n        {{display | async }}\r\n      </mat-select-trigger>\r\n      <mat-option *ngIf=\"filtered\" class=\"sd-filtered-input\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n        <mat-form-field class=\"sd-md\" appearance=\"outline\">\r\n          <mat-icon matPrefix>search</mat-icon>\r\n          <input #input placeholder=\"{{'Search' | sdTranslate}}\" matInput autocomplete=\"off\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"searchTerm$.next($event.target.value)\">\r\n        </mat-form-field>\r\n      </mat-option>\r\n      <ng-container *ngIf=\"valueField && displayField\">\r\n        <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item[valueField]\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item[displayField]\">\r\n          <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n            <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n            </ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n            {{ item[displayField] }}\r\n          </ng-container>\r\n        </mat-option>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"!valueField && !displayField\">\r\n        <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item\">\r\n          <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n            <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n            </ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n            {{ item }}\r\n          </ng-container>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-select>\r\n    <mat-icon\r\n      *ngIf=\"(multiple ? formControl?.value?.length : formControl?.value) && !isRequired && !formControl.disabled\"\r\n      class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel\r\n    </mat-icon>\r\n    <mat-error *ngIf=\"formControl.errors?.required && !disableErrorMessage\">\r\n      {{'This field is required' | sdTranslate}}\r\n    </mat-error>\r\n    <mat-error *ngIf=\"formControl?.errors?.customValidator && !disableErrorMessage\">\r\n      {{formControl?.errors?.customValidator}}\r\n    </mat-error>\r\n  </mat-form-field>\r\n</div>","styles":[":host{display:block;padding-top:5px}:host ::ng-deep .mat-form-field.mat-form-field-appearance-outline .mat-select-arrow-wrapper{transform:none}:host ::ng-deep .sd-selected .mat-select-arrow{border:none}:host ::ng-deep .mat-form-field.no-padding-wrapper .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .mat-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline{background:#f6f6f6;color:#e9e9e9}:host ::ng-deep .mat-form-field mat-select.mat-select-disabled .mat-select-value{color:#4d4d4d!important}:host ::ng-deep .mat-form-field .mat-placeholder-required{color:#f82c13}::ng-deep .sd-select-panel .mat-option.sd-filtered-input{background-color:#fff;position:-webkit-sticky;position:sticky;top:0;z-index:10}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field.mat-form-field-appearance-outline{width:100%}::ng-deep .sd-select-panel .mat-option.sd-filtered-input mat-pseudo-checkbox{display:none}::ng-deep .mat-select-panel .mat-option.sd-filtered-input{height:auto}::ng-deep .sd-select-panel .mat-option.sd-filtered-input input{color:#000}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field-prefix .mat-icon{margin-right:0}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper{padding:10px 0}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper .mat-form-field-outline{background-color:rgba(0,0,0,.04)}"]}]}],"members":{"input":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":18,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/input","name":"MatInput","line":18,"character":13}]}]}],"select":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":24,"character":3},"arguments":["select"]}]}],"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"_disableErrorMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3},"arguments":["disableErrorMessage"]}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":77,"character":3}}]}],"valueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":87,"character":3}}]}],"displayField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":88,"character":3}}]}],"required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":97,"character":3}}]}],"validator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":101,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":106,"character":3}}]}],"_multiple":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":115,"character":3},"arguments":["multiple"]}]}],"limit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":118,"character":3}}]}],"_filtered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":120,"character":3},"arguments":["filtered"]}]}],"selectDisplayDef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":123,"character":3},"arguments":[{"__symbolic":"reference","name":"SdSelectDisplayDefDirective"}]}]}],"_selectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":125,"character":3},"arguments":["selectAll"]}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":131,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":132,"character":3}}]}],"sdSelection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":133,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":136,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/utility","name":"SdUtilityService","line":137,"character":28}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onSelectAll":[{"__symbolic":"method"}]}},"SdSelectDisplayDefDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[sdSelectDisplayDef]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"reference","name":"any"}]}]}]}}},"origins":{"SdSelectModule":"./src/lib/select.module","SdSelect":"./src/lib/select.component","SdSelectDisplayDefDirective":"./src/lib/select-display-def.directive"},"importAs":"@sd-angular/core/select"}
+{"__symbolic":"module","version":4,"metadata":{"SdSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":20,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":21,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":22,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":23,"character":4},{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelectModule","line":24,"character":4},{"__symbolic":"reference","module":"@angular/material/progress-spinner","name":"MatProgressSpinnerModule","line":25,"character":4},{"__symbolic":"reference","module":"@angular/material/checkbox","name":"MatCheckboxModule","line":26,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":27,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":28,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSelect"},{"__symbolic":"reference","name":"SdSelectDisplayDefDirective"}],"exports":[{"__symbolic":"reference","name":"SdSelect"},{"__symbolic":"reference","name":"SdSelectDisplayDefDirective"},{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":37,"character":4}],"providers":[]}]}],"members":{}},"SdSelect":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"sd-select","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":13,"character":19},"member":"OnPush"},"template":"<div class=\"d-flex align-items-center\" [class.sd-view]=\"sdView?.templateRef\" [class.c-focused]=\"isFocused\"\r\n  [class.c-disabled]=\"formControl.disabled\" (click)=\"onClick()\">\r\n  <ng-container *ngIf=\"sdView?.templateRef && !isFocused; else default\">\r\n    <ng-container\r\n      *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value, selectedItems: selectedItems }\">\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #default>\r\n    <mat-form-field class=\"sd-md\" [ngClass]=\"{'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\"\r\n      appearance=\"outline\">\r\n      <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n      <mat-select #select [formControl]=\"formControl\" placeholder=\"{{placeholder || label}}\" multiple\r\n        (selectionChange)=\"onSelectionChange($event)\" disableOptionCentering=\"true\" panelClass=\"sd-select-panel\"\r\n        [ngClass]=\"{'sd-selected': !isRequired && (multiple ? formControl?.value?.length : formControl?.value)}\"\r\n        [required]=\"isRequired\" (openedChange)=\"onOpenChange($event)\" *ngIf=\"multiple\">\r\n        <mat-select-trigger>\r\n          {{display | async }}\r\n        </mat-select-trigger>\r\n        <mat-option *ngIf=\"filtered\" class=\"sd-filtered-input\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n          <mat-form-field class=\"sd-md\" appearance=\"outline\">\r\n            <mat-icon matPrefix>search</mat-icon>\r\n            <input #input placeholder=\"{{'Search' | sdTranslate}}\" matInput autocomplete=\"off\"\r\n              (keydown)=\"$event.stopPropagation()\" (keyup)=\"searchTerm$.next($event.target.value)\">\r\n          </mat-form-field>\r\n        </mat-option>\r\n        <ng-container *ngIf=\"multiple && selectAll\">\r\n          <mat-checkbox class=\"mat-option\" [(ngModel)]=\"allSelected\" [ngModelOptions]=\"{standalone: true}\"\r\n            (change)=\"onSelectAll()\">\r\n            Tất cả</mat-checkbox>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"valueField && displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item[valueField]\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item[displayField]\">\r\n            <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n              <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n              {{ item[displayField] }}\r\n            </ng-container>\r\n          </mat-option>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!valueField && !displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item\">\r\n            <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n              <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n              {{ item }}\r\n            </ng-container>\r\n          </mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n      <mat-select #select [formControl]=\"formControl\" placeholder=\"{{placeholder || label}}\"\r\n        (selectionChange)=\"onSelectionChange($event)\" disableOptionCentering=\"true\" panelClass=\"sd-select-panel\"\r\n        [ngClass]=\"{'sd-selected': !isRequired && formControl?.value}\" [required]=\"isRequired\"\r\n        (openedChange)=\"onOpenChange($event)\" *ngIf=\"!multiple\">\r\n        <mat-select-trigger>\r\n          {{display | async }}\r\n        </mat-select-trigger>\r\n        <mat-option *ngIf=\"filtered\" class=\"sd-filtered-input\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n          <mat-form-field class=\"sd-md\" appearance=\"outline\">\r\n            <mat-icon matPrefix>search</mat-icon>\r\n            <input #input placeholder=\"{{'Search' | sdTranslate}}\" matInput autocomplete=\"off\"\r\n              (keydown)=\"$event.stopPropagation()\" (keyup)=\"searchTerm$.next($event.target.value)\">\r\n          </mat-form-field>\r\n        </mat-option>\r\n        <ng-container *ngIf=\"valueField && displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item[valueField]\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item[displayField]\">\r\n            <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n              <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n              {{ item[displayField] }}\r\n            </ng-container>\r\n          </mat-option>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!valueField && !displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item\">\r\n            <ng-container *ngIf=\"selectDisplayDef?.templateRef\">\r\n              <ng-container *ngTemplateOutlet=\"selectDisplayDef.templateRef;context:{item: item}\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!selectDisplayDef?.templateRef\">\r\n              {{ item }}\r\n            </ng-container>\r\n          </mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n      <mat-icon\r\n        *ngIf=\"(multiple ? formControl?.value?.length : formControl?.value) && !isRequired && !formControl.disabled\"\r\n        class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel\r\n      </mat-icon>\r\n      <mat-error *ngIf=\"formControl.errors?.required && !disableErrorMessage\">\r\n        {{'This field is required' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl?.errors?.customValidator && !disableErrorMessage\">\r\n        {{formControl?.errors?.customValidator}}\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </ng-template>\r\n</div>","styles":[":host{display:block;padding-top:5px}:host ::ng-deep .mat-form-field.mat-form-field-appearance-outline .mat-select-arrow-wrapper{transform:none}:host ::ng-deep .sd-selected .mat-select-arrow{border:none}:host ::ng-deep .mat-form-field.no-padding-wrapper .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .mat-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline{background:#f6f6f6;color:#e9e9e9}:host ::ng-deep .mat-form-field mat-select.mat-select-disabled .mat-select-value{color:#4d4d4d!important}:host ::ng-deep .mat-form-field .mat-placeholder-required{color:#f82c13}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}::ng-deep .sd-select-panel .mat-option.sd-filtered-input{background-color:#fff;position:-webkit-sticky;position:sticky;top:0;z-index:10}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field.mat-form-field-appearance-outline{width:100%}::ng-deep .sd-select-panel .mat-option.sd-filtered-input mat-pseudo-checkbox{display:none}::ng-deep .mat-select-panel .mat-option.sd-filtered-input{height:auto}::ng-deep .sd-select-panel .mat-option.sd-filtered-input input{color:#000}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field-prefix .mat-icon{margin-right:0}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper{padding:10px 0}::ng-deep .sd-select-panel .mat-option.sd-filtered-input .mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper .mat-form-field-outline{background-color:rgba(0,0,0,.04)}"]}]}],"members":{"input":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":17,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/input","name":"MatInput","line":17,"character":13}]}]}],"select":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":23,"character":3},"arguments":["select"]}]}],"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"_disableErrorMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3},"arguments":["disableErrorMessage"]}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":3}}]}],"valueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":71,"character":3}}]}],"displayField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":72,"character":3}}]}],"required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":81,"character":3}}]}],"validator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":85,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":90,"character":3}}]}],"_multiple":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":99,"character":3},"arguments":["multiple"]}]}],"limit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":102,"character":3}}]}],"_filtered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":104,"character":3},"arguments":["filtered"]}]}],"selectDisplayDef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":107,"character":3},"arguments":[{"__symbolic":"reference","name":"SdSelectDisplayDefDirective"}]}]}],"_selectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":109,"character":3},"arguments":["selectAll"]}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":113,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3}}]}],"sdSelection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":115,"character":3}}]}],"sdView":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":128,"character":3},"arguments":[{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdViewDefDirective","line":128,"character":16}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":132,"character":17}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onSelectAll":[{"__symbolic":"method"}]}},"SdSelectDisplayDefDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[sdSelectDisplayDef]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"reference","name":"any"}]}]}]}}},"origins":{"SdSelectModule":"./src/lib/select.module","SdSelect":"./src/lib/select.component","SdSelectDisplayDefDirective":"./src/lib/select-display-def.directive"},"importAs":"@sd-angular/core/select"}

package/select/src/lib/select.component.d.ts

@@ -2,28 +2,26 @@ import { EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy, OnInit } fro
 import { NgForm, FormGroup } from '@angular/forms';
 import { MatSelect, MatSelectChange } from '@angular/material/select';
 import { Observable, Subject } from 'rxjs';
-import { SdUtilityService } from '@sd-angular/core/utility';
 import { MatInput } from '@angular/material/input';
 import { SdSelectDisplayDefDirective } from './select-display-def.directive';
-import { SdFormControl } from '@sd-angular/core/common';
+import { SdFormControl, SdViewDefDirective } from '@sd-angular/core/common';
 export declare class SdSelect implements OnInit, AfterViewInit, OnDestroy {
     #private;
     private ref;
-    private utilityService;
     set input(input: MatInput);
     select: MatSelect;
     set name(val: string);
     disableErrorMessage: boolean;
     set _disableErrorMessage(val: boolean | '');
     formControl: SdFormControl;
-    searchTerm$: Subject<unknown>;
+    searchTerm$: Subject<string>;
     size: 'sm' | 'lg';
     set form(val: NgForm | FormGroup);
     label: string;
     placeholder: string;
     display: Observable<string>;
     set model(value: undefined | boolean | number | string | (number | string)[]);
-    set items(items: undefined | any[] | ((searchText?: string | string[]) => Promise<any[]>));
+    set items(items: undefined | any[] | SearchFunc);
     valueField: string;
     displayField: string;
     loading: boolean;
@@ -39,8 +37,6 @@ export declare class SdSelect implements OnInit, AfterViewInit, OnDestroy {
     selectDisplayDef: SdSelectDisplayDefDirective;
     selectAll: boolean;
     set _selectAll(val: boolean | '');
-    filteredItems: Observable<any[]>;
-    allSelected: boolean;
     modelChange: EventEmitter<any>;
     sdChange: EventEmitter<any>;
     sdSelection: EventEmitter<{
@@ -48,7 +44,12 @@ export declare class SdSelect implements OnInit, AfterViewInit, OnDestroy {
         item?: any;
         items?: any[];
     }>;
-    constructor(ref: ChangeDetectorRef, utilityService: SdUtilityService);
+    selectedItems: any[];
+    filteredItems: Observable<any[]>;
+    allSelected: boolean;
+    sdView: SdViewDefDirective;
+    isFocused: boolean;
+    constructor(ref: ChangeDetectorRef);
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
@@ -56,5 +57,9 @@ export declare class SdSelect implements OnInit, AfterViewInit, OnDestroy {
     onSelectAll(): void;
     reValidate: () => void;
     clear: ($event?: any) => void;
+    onClick: () => void;
+    focus: () => void;
     onOpenChange: (isOpened: boolean) => void;
 }
+declare type SearchFunc = (searchText?: string | string[], isFormValue?: boolean) => Promise<any[]>;
+export {};

package/select/src/lib/select.module.d.ts

@@ -1,3 +1,2 @@
-import '@sd-angular/core/typing';
 export declare class SdSelectModule {
 }

package/select-editor/sd-angular-core-select-editor.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdSelectEditorModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":12,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":20,"character":4},{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelectModule","line":21,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":22,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSelectEditor"}],"exports":[{"__symbolic":"reference","name":"SdSelectEditor"}],"providers":[]}]}],"members":{}},"SdSelectEditor":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"sd-select-editor","template":"<div class=\"d-flex align-items-center\">\r\n  <div class=\"mat-label mr-12 mb-12\" *ngIf=\"leftLabel\" [ngStyle]=\"{'min-width': labelMinWidth}\">{{leftLabel}}</div>\r\n  <div class=\"media-body\">\r\n    <mat-form-field class=\"sd-md\" [ngClass]=\"{'sd-sm': size === 'sm'}\" appearance=\"outline\">\r\n      <mat-label *ngIf=\"label && !leftLabel\">{{label}}</mat-label>\r\n      <mat-select [formControl]=\"formControl\" placeholder=\"{{placeholder || label}}\"\r\n        (selectionChange)=\"onSelectionChange($event)\" [ngClass]=\"{'sd-selected': !isRequired && formControl?.value}\"\r\n        [required]=\"isRequired\" disableOptionCentering=\"true\" #matSelect>\r\n        <mat-select-trigger>\r\n          {{display | async }}\r\n        </mat-select-trigger>\r\n        <ng-container *ngIf=\"valueField && displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item[valueField]\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item[displayField]\">\r\n            <div style=\"display:flex; justify-content: space-between\">\r\n              <span>{{item[displayField]}}</span>\r\n              <div>\r\n                <mat-icon *ngIf=\"sdEdit?.observers?.length\" class=\"mr-1 c-fa-icon\" (click)=\"onEdit($event, item)\">\r\n                  edit</mat-icon>\r\n                <mat-icon *ngIf=\"sdDelete?.observers?.length\" class=\"mr-0 c-fa-icon\" (click)=\"onDelete($event, item)\">\r\n                  delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </mat-option>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!valueField && !displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item\">\r\n            <div style=\"display:flex; justify-content: space-between\">\r\n              <span>{{item}}</span>\r\n              <div>\r\n                <mat-icon *ngIf=\"sdEdit?.observers?.length\" class=\"mr-1 c-action-icon\" (click)=\"onEdit($event, item)\">\r\n                  edit</mat-icon>\r\n                <mat-icon *ngIf=\"sdDelete?.observers?.length\" class=\"mr-0 c-action-icon\"\r\n                  (click)=\"onDelete($event, item)\">delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </mat-option>\r\n        </ng-container>\r\n        <mat-option *ngIf=\"sdAdd?.observers?.length\">\r\n          <div (click)=\"onAdd($event)\">\r\n            <mat-icon class=\"mr-1\">add</mat-icon>\r\n            {{'New item' | sdTranslate}}\r\n          </div>\r\n        </mat-option>\r\n      </mat-select>\r\n      <mat-icon *ngIf=\"formControl?.value && !isRequired && !formControl.disabled\" class=\"pointer sd-suffix-icon\"\r\n        (click)=\"clear($event)\" matSuffix>cancel\r\n      </mat-icon>\r\n      <mat-error *ngIf=\"formControl.errors?.required\">\r\n        {{'This field is required' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl?.errors?.customValidator\">\r\n        {{formControl?.errors?.customValidator}}\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n</div>","styles":[":host ::ng-deep .mat-form-field.mat-form-field-appearance-outline .mat-select-arrow-wrapper{transform:none}:host ::ng-deep .sd-selected .mat-select-arrow{border:none}.c-action-icon{color:#dadada;font-size:21px;height:20px;width:20px}.c-action-icon:hover{color:#616161}"]}]}],"members":{"matSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":16,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelect","line":16,"character":13}]}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":48,"character":3}}]}],"leftLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3}}]}],"labelMinWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3}}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"valueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":3}}]}],"displayField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":3}}]}],"required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":73,"character":3}}]}],"validator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":77,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":3}}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":96,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":97,"character":3}}]}],"sdSelection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":98,"character":3}}]}],"sdAdd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":99,"character":3}}]}],"sdEdit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":100,"character":3}}]}],"sdDelete":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":101,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":104,"character":17}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}}},"origins":{"SdSelectEditorModule":"./src/lib/select-editor.module","SdSelectEditor":"./src/lib/select-editor.component"},"importAs":"@sd-angular/core/select-editor"}
+{"__symbolic":"module","version":4,"metadata":{"SdSelectEditorModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelectModule","line":20,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":21,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSelectEditor"}],"exports":[{"__symbolic":"reference","name":"SdSelectEditor"}],"providers":[]}]}],"members":{}},"SdSelectEditor":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"sd-select-editor","template":"<div class=\"d-flex align-items-center\">\r\n  <div class=\"mat-label mr-12 mb-12\" *ngIf=\"leftLabel\" [ngStyle]=\"{'min-width': labelMinWidth}\">{{leftLabel}}</div>\r\n  <div class=\"media-body\">\r\n    <mat-form-field class=\"sd-md\" [ngClass]=\"{'sd-sm': size === 'sm'}\" appearance=\"outline\">\r\n      <mat-label *ngIf=\"label && !leftLabel\">{{label}}</mat-label>\r\n      <mat-select [formControl]=\"formControl\" placeholder=\"{{placeholder || label}}\"\r\n        (selectionChange)=\"onSelectionChange($event)\" [ngClass]=\"{'sd-selected': !isRequired && formControl?.value}\"\r\n        [required]=\"isRequired\" disableOptionCentering=\"true\" #matSelect>\r\n        <mat-select-trigger>\r\n          {{display | async }}\r\n        </mat-select-trigger>\r\n        <ng-container *ngIf=\"valueField && displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item[valueField]\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item[displayField]\">\r\n            <div style=\"display:flex; justify-content: space-between\">\r\n              <span>{{item[displayField]}}</span>\r\n              <div>\r\n                <mat-icon *ngIf=\"sdEdit?.observers?.length\" class=\"mr-1 c-fa-icon\" (click)=\"onEdit($event, item)\">\r\n                  edit</mat-icon>\r\n                <mat-icon *ngIf=\"sdDelete?.observers?.length\" class=\"mr-0 c-fa-icon\" (click)=\"onDelete($event, item)\">\r\n                  delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </mat-option>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!valueField && !displayField\">\r\n          <mat-option *ngFor=\"let item of filteredItems | async\" [value]=\"item\" matTooltipPosition=\"above\"\r\n            [matTooltip]=\"item\">\r\n            <div style=\"display:flex; justify-content: space-between\">\r\n              <span>{{item}}</span>\r\n              <div>\r\n                <mat-icon *ngIf=\"sdEdit?.observers?.length\" class=\"mr-1 c-action-icon\" (click)=\"onEdit($event, item)\">\r\n                  edit</mat-icon>\r\n                <mat-icon *ngIf=\"sdDelete?.observers?.length\" class=\"mr-0 c-action-icon\"\r\n                  (click)=\"onDelete($event, item)\">delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </mat-option>\r\n        </ng-container>\r\n        <mat-option *ngIf=\"sdAdd?.observers?.length\">\r\n          <div (click)=\"onAdd($event)\">\r\n            <mat-icon class=\"mr-1\">add</mat-icon>\r\n            {{'New item' | sdTranslate}}\r\n          </div>\r\n        </mat-option>\r\n      </mat-select>\r\n      <mat-icon *ngIf=\"formControl?.value && !isRequired && !formControl.disabled\" class=\"pointer sd-suffix-icon\"\r\n        (click)=\"clear($event)\" matSuffix>cancel\r\n      </mat-icon>\r\n      <mat-error *ngIf=\"formControl.errors?.required\">\r\n        {{'This field is required' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl?.errors?.customValidator\">\r\n        {{formControl?.errors?.customValidator}}\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n</div>","styles":[":host ::ng-deep .mat-form-field.mat-form-field-appearance-outline .mat-select-arrow-wrapper{transform:none}:host ::ng-deep .sd-selected .mat-select-arrow{border:none}.c-action-icon{color:#dadada;font-size:21px;height:20px;width:20px}.c-action-icon:hover{color:#616161}"]}]}],"members":{"matSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":16,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelect","line":16,"character":13}]}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":48,"character":3}}]}],"leftLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3}}]}],"labelMinWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3}}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"valueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":3}}]}],"displayField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":3}}]}],"required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":73,"character":3}}]}],"validator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":77,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":3}}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":96,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":97,"character":3}}]}],"sdSelection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":98,"character":3}}]}],"sdAdd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":99,"character":3}}]}],"sdEdit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":100,"character":3}}]}],"sdDelete":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":101,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":104,"character":17}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}}},"origins":{"SdSelectEditorModule":"./src/lib/select-editor.module","SdSelectEditor":"./src/lib/select-editor.component"},"importAs":"@sd-angular/core/select-editor"}

package/select-editor/src/lib/select-editor.module.d.ts

@@ -1,3 +1,2 @@
-import '@sd-angular/core/typing';
 export declare class SdSelectEditorModule {
 }

package/service/sd-angular-core-service.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdServiceModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@sd-angular/core/api","name":"SdApiModule","line":8,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":9,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyModule","line":10,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/utility","name":"SdUtilityModule","line":11,"character":4}],"declarations":[],"providers":[],"exports":[{"__symbolic":"reference","module":"@sd-angular/core/api","name":"SdApiModule","line":18,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":19,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyModule","line":20,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/utility","name":"SdUtilityModule","line":21,"character":4}]}]}],"members":{}}},"origins":{"SdServiceModule":"./src/lib/service.module"},"importAs":"@sd-angular/core/service"}
+{"__symbolic":"module","version":4,"metadata":{"SdServiceModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@sd-angular/core/api","name":"SdApiModule","line":8,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":9,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyModule","line":10,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/utility","name":"SdUtilityModule","line":11,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":12,"character":4}],"declarations":[],"providers":[],"exports":[{"__symbolic":"reference","module":"@sd-angular/core/api","name":"SdApiModule","line":19,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":20,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyModule","line":21,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/utility","name":"SdUtilityModule","line":22,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":23,"character":4}]}]}],"members":{}}},"origins":{"SdServiceModule":"./src/lib/service.module"},"importAs":"@sd-angular/core/service"}

package/service/src/lib/service.module.d.ts

@@ -1,3 +1,2 @@
-import './typings';
 export declare class SdServiceModule {
 }

package/service/src/public-api.d.ts

@@ -1,2 +1,2 @@
-import './lib/typings';
+import '@sd-angular/core/common';
 export * from './lib/service.module';

package/side-drawer/sd-angular-core-side-drawer.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdSideDrawer":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"sd-side-drawer","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":19},"member":"OnPush"},"template":"<ng-template cdkPortal>\r\n  <div [id]=\"id\" class=\"side-drawer\" [ngStyle]=\"{'width': width}\" [ngClass]=\"{'side-drawer--active': isOpened,'side-drawer--loading': isLoading}\"\r\n    (mouseover)=\"isHover = true\" (mouseout)=\"isHover = false\">\r\n    <ng-container *ngIf=\"isOpened\">\r\n      <div class=\"side-drawer__header media align-items-center\">\r\n        <div class=\"side-drawer__title media-body\">\r\n          <ng-content select=\"[sdTitle]\"></ng-content>\r\n        </div>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"toggleEditable()\" *ngIf=\"editable\" mat-icon-button>\r\n          <mat-icon>edit</mat-icon>\r\n        </button>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"close()\" mat-icon-button>\r\n          <mat-icon>close</mat-icon>\r\n        </button>\r\n      </div>\r\n      <div *ngIf=\"isOpened\" class=\"side-drawer__body\">\r\n        <div class=\"side-drawer__content\">\r\n          <ng-content select=\"[sdBody]\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"side-drawer__footer\">\r\n        <ng-content select=\"[sdFooter]\"></ng-content>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <button *ngIf=\"isOpened\" type=\"button\" class=\"side-drawer-backdrop\" (click)=\"close()\"\r\n    [ngClass]=\"{ 'side-drawer-backdrop--active': isHover }\"></button>\r\n</ng-template>","styles":[".side-drawer{background-color:#fff;bottom:0;box-shadow:0 .4px .8px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.2);display:flex;flex-direction:column;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transform:translate3d(100%,0,0);transition:all .3s ease-in-out;visibility:hidden;z-index:999}.c-action{color:#212121}.c-action:focus{outline:none}.side-drawer__icon{background:transparent;border:0;color:#212121;outline:none;overflow:hidden}.side-drawer__icon .mat-icon{float:left}.side-drawer__header{min-height:64px;padding:12px 16px}.side-drawer__body{flex:1;position:relative}.side-drawer__content{bottom:0;left:0;overflow:auto;padding:0 16px 16px;position:absolute;right:0;top:0}.side-drawer__footer{border-top:1px solid #dde0e5;padding:5px 0}.side-drawer-backdrop{background:none;border:0;bottom:0;height:100%;left:0;outline:none!important;position:fixed;right:0;top:0;transition:all .3s ease-in-out;width:100%;z-index:99}.side-drawer-backdrop--active{background-color:rgba(0,0,0,.4)}.side-drawer--active{opacity:1;pointer-events:all;transform:translateZ(0);visibility:visible}.side-drawer__title{font-size:20px;font-weight:500;line-height:28px}"]}]}],"members":{"portal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":27,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/cdk/portal","name":"CdkPortal","line":27,"character":13}]}]}],"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"editingChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":39,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"ApplicationRef","line":40,"character":16},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":41,"character":22},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":42,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/loading","name":"SdLoadingService","line":43,"character":28}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"toggleEditable":[{"__symbolic":"method"}]}},"SdSideDrawerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialogModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":16,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/button","name":"SdButtonModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":18,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSideDrawer"}],"exports":[{"__symbolic":"reference","name":"SdSideDrawer"}],"providers":[]}]}],"members":{}}},"origins":{"SdSideDrawer":"./src/lib/side-drawer/side-drawer.component","SdSideDrawerModule":"./src/lib/side-drawer.module"},"importAs":"@sd-angular/core/side-drawer"}
+{"__symbolic":"module","version":4,"metadata":{"SdSideDrawer":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"sd-side-drawer","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":19},"member":"OnPush"},"template":"<ng-template cdkPortal>\r\n  <div [id]=\"id\" class=\"side-drawer\" [ngStyle]=\"{'width': width}\" [ngClass]=\"{'side-drawer--active': isOpened,'side-drawer--loading': isLoading}\"\r\n    (mouseover)=\"isHover = true\" (mouseout)=\"isHover = false\">\r\n    <ng-container *ngIf=\"isOpened\">\r\n      <div class=\"side-drawer__header media align-items-center\">\r\n        <div class=\"side-drawer__title media-body\">\r\n          <ng-content select=\"[sdTitle]\"></ng-content>\r\n        </div>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"toggleEditable()\" *ngIf=\"editable\" mat-icon-button>\r\n          <mat-icon>edit</mat-icon>\r\n        </button>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"close()\" mat-icon-button>\r\n          <mat-icon>close</mat-icon>\r\n        </button>\r\n      </div>\r\n      <div *ngIf=\"isOpened\" class=\"side-drawer__body\">\r\n        <div class=\"side-drawer__content\">\r\n          <ng-content select=\"[sdBody]\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"side-drawer__footer\">\r\n        <ng-content select=\"[sdFooter]\"></ng-content>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <button *ngIf=\"isOpened\" type=\"button\" class=\"side-drawer-backdrop\" (click)=\"close()\"\r\n    [ngClass]=\"{ 'side-drawer-backdrop--active': isHover }\"></button>\r\n</ng-template>","styles":[".side-drawer{background-color:#fff;bottom:0;box-shadow:0 .4px .8px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.2);display:flex;flex-direction:column;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transform:translate3d(100%,0,0);transition:all .3s ease-in-out;visibility:hidden;z-index:999}.c-action{color:#212121}.c-action:focus{outline:none}.side-drawer__icon{background:transparent;border:0;color:#212121;outline:none;overflow:hidden}.side-drawer__icon .mat-icon{float:left}.side-drawer__header{min-height:64px;padding:12px 16px}.side-drawer__body{flex:1;position:relative}.side-drawer__content{bottom:0;left:0;overflow:auto;padding:0 16px 16px;position:absolute;right:0;top:0}.side-drawer__footer{border-top:1px solid #dde0e5;padding:5px 0}.side-drawer-backdrop{background:none;border:0;bottom:0;height:100%;left:0;outline:none!important;position:fixed;right:0;top:0;transition:all .3s ease-in-out;width:100%;z-index:99}.side-drawer-backdrop--active{background-color:rgba(0,0,0,.4)}.side-drawer--active{opacity:1;pointer-events:all;transform:translateZ(0);visibility:visible}.side-drawer__title{font-size:20px;font-weight:500;line-height:28px}"]}]}],"members":{"portal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":27,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/cdk/portal","name":"CdkPortal","line":27,"character":13}]}]}],"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"editingChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":39,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"ApplicationRef","line":40,"character":16},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":41,"character":22},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":42,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/loading","name":"SdLoadingService","line":43,"character":28}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"toggleEditable":[{"__symbolic":"method"}]}},"SdSideDrawerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialogModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":15,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/button","name":"SdButtonModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":17,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSideDrawer"}],"exports":[{"__symbolic":"reference","name":"SdSideDrawer"}],"providers":[]}]}],"members":{}}},"origins":{"SdSideDrawer":"./src/lib/side-drawer/side-drawer.component","SdSideDrawerModule":"./src/lib/side-drawer.module"},"importAs":"@sd-angular/core/side-drawer"}

package/side-drawer/src/lib/side-drawer.module.d.ts

@@ -1,3 +1,2 @@
-import '@sd-angular/core/typing';
 export declare class SdSideDrawerModule {
 }

package/time/sd-angular-core-time.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdTimeModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":8,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":9,"character":4},{"__symbolic":"reference","module":"ngx-material-timepicker","name":"NgxMaterialTimepickerModule","line":10,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵa"}],"exports":[{"__symbolic":"reference","name":"ɵa"}],"providers":[]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":14,"character":1},"arguments":[{"selector":"sd-time","template":"<label *ngIf=\"label\" class=\"d-block T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<ngx-timepicker-field [ngModel]=\"formControl?.value\" [format]=\"24\" (timeChanged)=\"onTimeChanged($event)\"\r\n  [min]=\"min\" [max]=\"max\" [disabled]=\"formControl?.disabled\" controlOnly></ngx-timepicker-field>"}]}],"members":{"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"_min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3},"arguments":["min"]}]}],"_max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3},"arguments":["max"]}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":73,"character":3}}]}],"defaultTime":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":74,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":75,"character":3}}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":81,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":82,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnDestroy":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}}},"origins":{"SdTimeModule":"./src/lib/time.module","ɵa":"./src/lib/time.component"},"importAs":"@sd-angular/core/time"}
+{"__symbolic":"module","version":4,"metadata":{"SdTimeModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":8,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":9,"character":4},{"__symbolic":"reference","module":"ngx-material-timepicker","name":"NgxMaterialTimepickerModule","line":10,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵa"}],"exports":[{"__symbolic":"reference","name":"ɵa"}],"providers":[]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"sd-time","template":"<label *ngIf=\"label\" class=\"d-block T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<ngx-timepicker-field [ngModel]=\"formControl?.value\" [format]=\"24\" (timeChanged)=\"onTimeChanged($event)\"\r\n  [min]=\"min\" [max]=\"max\" [disabled]=\"formControl?.disabled\" controlOnly></ngx-timepicker-field>"}]}],"members":{"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"_min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3},"arguments":["min"]}]}],"_max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3},"arguments":["max"]}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":72,"character":3}}]}],"defaultTime":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":73,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":74,"character":3}}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":80,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":81,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnDestroy":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}}},"origins":{"SdTimeModule":"./src/lib/time.module","ɵa":"./src/lib/time.component"},"importAs":"@sd-angular/core/time"}

package/time/src/lib/time.component.d.ts

@@ -1,6 +1,5 @@
 import { EventEmitter, OnDestroy, AfterViewInit, OnInit } from '@angular/core';
 import { FormControl, FormGroup, NgForm } from '@angular/forms';
-import '@sd-angular/core/typing';
 export declare class SdTime implements OnDestroy, OnInit, AfterViewInit {
     #private;
     id: string;

package/time/src/public-api.d.ts

@@ -1 +1,2 @@
+import '@sd-angular/core/common';
 export { SdTimeModule } from './lib/time.module';

package/upload-excel/sd-angular-core-upload-excel.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdUploadExcelOption":{"__symbolic":"interface"},"SdUploadExcelColumn":{"__symbolic":"interface"},"SdUploadExcelBaseColumn":{"__symbolic":"interface"},"SdUploadExcelColumnString":{"__symbolic":"interface"},"SdUploadExcelColumnNumber":{"__symbolic":"interface"},"SdUploadExcelColumnBool":{"__symbolic":"interface"},"SdUploadExcelColumnDate":{"__symbolic":"interface"},"SdUploadExcelColumnTime":{"__symbolic":"interface"},"SdUploadExcelColumnDateTime":{"__symbolic":"interface"},"SdUploadExcelColumnValues":{"__symbolic":"interface"},"SdUploadExcelColumnStringArray":{"__symbolic":"interface"},"SdUploadExcelValidation":{"__symbolic":"interface"},"ExcelItem":{"__symbolic":"interface"},"SdUploadExcel":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":27,"character":1},"arguments":[{"selector":"sd-upload-excel","template":"<sd-modal [title]=\"(option?.title || 'Import Excel')| sdTranslate\" #modal>\r\n  <sd-modal-body background=\"#F0F8FF\">\r\n    <div class=\"row mx-0 mb-10\">\r\n      <sd-button *ngIf=\"items?.length\" class=\"mr-5\" (action)=\"view('ALL')\" icon=\"cached\"\r\n        [title]=\"'View all' | sdTranslate\" size=\"sm\"></sd-button>\r\n      <sd-button *ngIf=\"numberOfSuccess\" class=\"mr-5\" (action)=\"view('SUCCESS')\" icon=\"done\" [title]=\"numberOfSuccess\"\r\n        [tooltip]=\"'Number of success rows' | sdTranslate\" size=\"sm\" color=\"success\"></sd-button>\r\n      <sd-button *ngIf=\"numberOfWarning\" class=\"mr-5\" (action)=\"view('WARNING')\" icon=\"warning\"\r\n        [title]=\"numberOfWarning\" [tooltip]=\"'Number of warning rows' | sdTranslate\" size=\"sm\"></sd-button>\r\n      <sd-button *ngIf=\"numberOfError\" class=\"mr-5\" (action)=\"view('ERROR')\" icon=\"error\" [title]=\"numberOfError\"\r\n        color=\"danger\" [tooltip]=\"'Number of error rows' | sdTranslate\" size=\"sm\"></sd-button>\r\n    </div>\r\n    <div class=\"sd-box\">\r\n      <div class=\"sd-box-body p-0\">\r\n        <div class=\"table-responsive\" style=\"position: relative; height:50vh\">\r\n          <table class=\"table table-striped table-sm table-hover table-bordered\">\r\n            <thead class=\"thead-light\">\r\n              <tr>\r\n                <th class=\"text-center position-sticky c-sticky-left\" style=\"width: 50px\">#</th>\r\n                <th *ngIf=\"filteredItems?.length\" class=\"text-center\" style=\"min-width: 250px; width: 250px\">\r\n                  {{'Upload message' | sdTranslate}}</th>\r\n                <th *ngFor=\"let column of option.columns\"\r\n                  [ngStyle]=\"{'min-width':column.width ? column.width : '300px'}\" [matTooltip]=\"column.title\">\r\n                  <span class=\"c-ellipsis\"\r\n                    [ngStyle]=\"{'min-width':column.width ? column.width : '300px', 'max-width':column.width ? column.width : '300px'}\">{{column.title}}</span>\r\n                </th>\r\n              </tr>\r\n            </thead>\r\n            <tbody *ngIf=\"viewItems.length\">\r\n              <tr *ngFor=\"let item of viewItems\">\r\n                <td class=\"text-center position-sticky c-sticky-left\" style=\"width: 50px\">\r\n                  <span class=\"badge\"\r\n                    [ngClass]=\"{'badge-success':!item.validation?.warning && !item.validation?.error, 'badge-warning':item.validation?.warning && !item.validation?.error, 'badge-danger':item.validation?.error}\"\r\n                    style=\"width: 100%\">{{item.excelIndex}}</span>\r\n                </td>\r\n                <td style=\"min-width: 250px; width: 250px\">\r\n                  <div\r\n                    [innerHtml]=\"item.validation?.error || item.validation?.warning || item.validation?.success || ('Success' | sdTranslate)\">\r\n                  </div>\r\n                </td>\r\n                <td *ngFor=\"let column of option.columns\" class=\"align-middle\"\r\n                  [ngClass]=\"{'table-warning':item.validation?.data[column.field]?.warning && !item.validation?.data[column.field]?.error, 'table-danger':item.validation?.data[column.field]?.error}\"\r\n                  [matTooltip]=\"item.validation?.data[column.field]?.error || item.validation?.data[column.field]?.warning\"\r\n                  [ngStyle]=\"{'min-width':column.width ? column.width : '300px'}\" matTooltipPosition=\"above\">\r\n                  <span class=\"c-ellipsis\">\r\n                    <ng-container *ngIf=\"column.type === 'date' || column.type === 'datetime' && item.origin\">\r\n                      {{item.origin[column.field]}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"column.type === 'number'\">\r\n                      {{item.validation?.data[column.field]?.error ? item[column.field] : (item[column.field] | number :\r\n                      '1.0-2')}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"column.type === 'array'\">\r\n                      {{item[column.field]?.split(column.divideString)?.length}} {{column.unitString}}\r\n                      <button mat-button [matMenuTriggerFor]=\"menu\" class=\"c-mat-menu\">\r\n                        <mat-icon>open_in_new</mat-icon>\r\n                      </button>\r\n                      <mat-menu #menu=\"matMenu\">\r\n                        <div class=\"row mx-0\">\r\n                          <div class=\"col-6\" *ngFor=\"let itemArray of item[column.field]?.split(column.divideString)\">\r\n                            {{itemArray}}\r\n                          </div>\r\n                        </div>\r\n                      </mat-menu>\r\n                    </ng-container>\r\n                    <ng-container\r\n                      *ngIf=\"column.type !== 'date' && column.type !== 'datetime' && column.type !== 'number' && column.type !== 'array'\">\r\n                      {{item[column.field]}}\r\n                    </ng-container>\r\n                  </span>\r\n                </td>\r\n              </tr>\r\n            </tbody>\r\n          </table>\r\n        </div>\r\n      </div>\r\n      <div class=\"sd-box-footer clearfix\">\r\n        <div style=\"display: flex; align-items: center; align-content: space-between;\">\r\n          <div style=\"flex: 1;\" [innerHTML]=\"option?.note\">\r\n          </div>\r\n          <div style=\"flex: 1;\">\r\n            <mat-paginator [length]=\"filteredItems?.length || 0\" hidePageSize>\r\n            </mat-paginator>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </sd-modal-body>\r\n  <sd-modal-footer *sdDesktop>\r\n    <div class=\"mr-auto\">\r\n      <sd-button class=\"mr-5\" (action)=\"upload()\" icon=\"file_upload\" [title]=\"'Upload' | sdTranslate\" size=\"sm\"\r\n        color=\"info\"></sd-button>\r\n      <sd-button class=\"mr-5\" (action)=\"downloadTemplate()\" icon=\"file_download\"\r\n        [title]=\"'Download template' | sdTranslate\" color=\"info\" size=\"sm\">\r\n      </sd-button>\r\n    </div>\r\n    <sd-button *ngIf=\"filteredItems?.length\" class=\"mr-5\" (action)=\"export()\" icon=\"get_app\"\r\n      [title]=\"'Download result' | sdTranslate\" size=\"sm\" color=\"info\">\r\n    </sd-button>\r\n    <sd-button (action)=\"accept()\" icon=\"check\" [title]=\"'Accept' | sdTranslate\"\r\n      [disabled]=\"numberOfSuccess === 0 || numberOfError > 0 || isUploaded\" color=\"success\" 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)=\"upload()\" icon=\"file_upload\"\r\n      [title]=\"'Upload' | sdTranslate\" width=\"100%\" size=\"sm\" color=\"info\"></sd-button>\r\n    <sd-button style=\"flex: 1; padding-left: 5px;\" (action)=\"accept()\" icon=\"check\" [title]=\"'Accept' | sdTranslate\"\r\n      [disabled]=\"numberOfSuccess === 0 || numberOfError > 0\" color=\"success\" width=\"100%\" size=\"sm\"></sd-button>\r\n  </sd-modal-footer>\r\n</sd-modal>","styles":[".table thead td,.table thead th{padding-bottom:5px;padding-top:5px}.table-striped tbody tr:nth-of-type(2n) .c-sticky-left{background-color:#fff}.table-striped tbody tr:nth-of-type(odd) .c-sticky-left{background-color:#f2f2f2}.c-sticky-left{border-left:none!important;border-right:none!important;left:0!important;z-index:20}.c-ellipsis{display:block;overflow:hidden!important;padding:.1rem;text-overflow:ellipsis;white-space:nowrap}.c-mat-menu{border:none}.c-mat-menu mat-icon{font-size:20px;vertical-align:middle}:host ::ng-deep .mat-paginator-container{height:32px;min-height:32px}:host ::ng-deep .mat-paginator-container .mat-icon-button{height:28px;line-height:28px;width:28px}"]}]}],"members":{"option":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"modal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":35,"character":3},"arguments":["modal"]}]}],"paginator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":48,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginator","line":48,"character":13}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":59,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/excel","name":"SdExcelService","line":60,"character":26},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateService","line":61,"character":30},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyService","line":62,"character":27},{"__symbolic":"reference","module":"@sd-angular/core/loading","name":"SdLoadingService","line":63,"character":28}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"SdUploadExcelModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":18,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":20,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":21,"character":4},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"ngx-device-detector","name":"DeviceDetectorModule","line":22,"character":4},"member":"forRoot"}},{"__symbolic":"reference","module":"@angular/material/slide-toggle","name":"MatSlideToggleModule","line":23,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":24,"character":4},{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginatorModule","line":25,"character":4},{"__symbolic":"reference","module":"@angular/material/slide-toggle","name":"MatSlideToggleModule","line":26,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyModule","line":27,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":28,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/utility","name":"SdUtilityModule","line":29,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/button","name":"SdButtonModule","line":30,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/modal","name":"SdModalModule","line":31,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/input","name":"SdInputModule","line":32,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":33,"character":4},{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuModule","line":34,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdUploadExcel"}],"exports":[{"__symbolic":"reference","name":"SdUploadExcel"}],"providers":[]}]}],"members":{}}},"origins":{"SdUploadExcelOption":"./src/lib/upload-excel.model","SdUploadExcelColumn":"./src/lib/upload-excel.model","SdUploadExcelBaseColumn":"./src/lib/upload-excel.model","SdUploadExcelColumnString":"./src/lib/upload-excel.model","SdUploadExcelColumnNumber":"./src/lib/upload-excel.model","SdUploadExcelColumnBool":"./src/lib/upload-excel.model","SdUploadExcelColumnDate":"./src/lib/upload-excel.model","SdUploadExcelColumnTime":"./src/lib/upload-excel.model","SdUploadExcelColumnDateTime":"./src/lib/upload-excel.model","SdUploadExcelColumnValues":"./src/lib/upload-excel.model","SdUploadExcelColumnStringArray":"./src/lib/upload-excel.model","SdUploadExcelValidation":"./src/lib/upload-excel.model","ExcelItem":"./src/lib/upload-excel.model","SdUploadExcel":"./src/lib/upload-excel.component","SdUploadExcelModule":"./src/lib/upload-excel.module"},"importAs":"@sd-angular/core/upload-excel"}
+{"__symbolic":"module","version":4,"metadata":{"SdUploadExcelOption":{"__symbolic":"interface"},"SdUploadExcelColumn":{"__symbolic":"interface"},"SdUploadExcelBaseColumn":{"__symbolic":"interface"},"SdUploadExcelColumnString":{"__symbolic":"interface"},"SdUploadExcelColumnNumber":{"__symbolic":"interface"},"SdUploadExcelColumnBool":{"__symbolic":"interface"},"SdUploadExcelColumnDate":{"__symbolic":"interface"},"SdUploadExcelColumnTime":{"__symbolic":"interface"},"SdUploadExcelColumnDateTime":{"__symbolic":"interface"},"SdUploadExcelColumnValues":{"__symbolic":"interface"},"SdUploadExcelColumnStringArray":{"__symbolic":"interface"},"SdUploadExcelValidation":{"__symbolic":"interface"},"ExcelItem":{"__symbolic":"interface"},"SdUploadExcel":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":26,"character":1},"arguments":[{"selector":"sd-upload-excel","template":"<sd-modal [title]=\"(option?.title || 'Import Excel')| sdTranslate\" #modal>\r\n  <sd-modal-body background=\"#F0F8FF\">\r\n    <div class=\"row mx-0 mb-10\">\r\n      <sd-button *ngIf=\"items?.length\" class=\"mr-5\" (action)=\"view('ALL')\" icon=\"cached\"\r\n        [title]=\"'View all' | sdTranslate\" size=\"sm\"></sd-button>\r\n      <sd-button *ngIf=\"numberOfSuccess\" class=\"mr-5\" (action)=\"view('SUCCESS')\" icon=\"done\" [title]=\"numberOfSuccess\"\r\n        [tooltip]=\"'Number of success rows' | sdTranslate\" size=\"sm\" color=\"success\"></sd-button>\r\n      <sd-button *ngIf=\"numberOfWarning\" class=\"mr-5\" (action)=\"view('WARNING')\" icon=\"warning\"\r\n        [title]=\"numberOfWarning\" [tooltip]=\"'Number of warning rows' | sdTranslate\" size=\"sm\"></sd-button>\r\n      <sd-button *ngIf=\"numberOfError\" class=\"mr-5\" (action)=\"view('ERROR')\" icon=\"error\" [title]=\"numberOfError\"\r\n        color=\"danger\" [tooltip]=\"'Number of error rows' | sdTranslate\" size=\"sm\"></sd-button>\r\n    </div>\r\n    <div class=\"sd-box\">\r\n      <div class=\"sd-box-body p-0\">\r\n        <div class=\"table-responsive\" style=\"position: relative; height:50vh\">\r\n          <table class=\"table table-striped table-sm table-hover table-bordered\">\r\n            <thead class=\"thead-light\">\r\n              <tr>\r\n                <th class=\"text-center position-sticky c-sticky-left\" style=\"width: 50px\">#</th>\r\n                <th *ngIf=\"filteredItems?.length\" class=\"text-center\" style=\"min-width: 250px; width: 250px\">\r\n                  {{'Upload message' | sdTranslate}}</th>\r\n                <th *ngFor=\"let column of option.columns\"\r\n                  [ngStyle]=\"{'min-width':column.width ? column.width : '300px'}\" [matTooltip]=\"column.title\">\r\n                  <span class=\"c-ellipsis\"\r\n                    [ngStyle]=\"{'min-width':column.width ? column.width : '300px', 'max-width':column.width ? column.width : '300px'}\">{{column.title}}</span>\r\n                </th>\r\n              </tr>\r\n            </thead>\r\n            <tbody *ngIf=\"viewItems.length\">\r\n              <tr *ngFor=\"let item of viewItems\">\r\n                <td class=\"text-center position-sticky c-sticky-left\" style=\"width: 50px\">\r\n                  <span class=\"badge\"\r\n                    [ngClass]=\"{'badge-success':!item.validation?.warning && !item.validation?.error, 'badge-warning':item.validation?.warning && !item.validation?.error, 'badge-danger':item.validation?.error}\"\r\n                    style=\"width: 100%\">{{item.excelIndex}}</span>\r\n                </td>\r\n                <td style=\"min-width: 250px; width: 250px\">\r\n                  <div\r\n                    [innerHtml]=\"item.validation?.error || item.validation?.warning || item.validation?.success || ('Success' | sdTranslate)\">\r\n                  </div>\r\n                </td>\r\n                <td *ngFor=\"let column of option.columns\" class=\"align-middle\"\r\n                  [ngClass]=\"{'table-warning':item.validation?.data[column.field]?.warning && !item.validation?.data[column.field]?.error, 'table-danger':item.validation?.data[column.field]?.error}\"\r\n                  [matTooltip]=\"item.validation?.data[column.field]?.error || item.validation?.data[column.field]?.warning\"\r\n                  [ngStyle]=\"{'min-width':column.width ? column.width : '300px'}\" matTooltipPosition=\"above\">\r\n                  <span class=\"c-ellipsis\">\r\n                    <ng-container *ngIf=\"column.type === 'date' || column.type === 'datetime' && item.origin\">\r\n                      {{item.origin[column.field]}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"column.type === 'number'\">\r\n                      {{item.validation?.data[column.field]?.error ? item[column.field] : (item[column.field] | number :\r\n                      '1.0-2')}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"column.type === 'array'\">\r\n                      {{item[column.field]?.split(column.divideString)?.length}} {{column.unitString}}\r\n                      <button mat-button [matMenuTriggerFor]=\"menu\" class=\"c-mat-menu\">\r\n                        <mat-icon>open_in_new</mat-icon>\r\n                      </button>\r\n                      <mat-menu #menu=\"matMenu\">\r\n                        <div class=\"row mx-0\">\r\n                          <div class=\"col-6\" *ngFor=\"let itemArray of item[column.field]?.split(column.divideString)\">\r\n                            {{itemArray}}\r\n                          </div>\r\n                        </div>\r\n                      </mat-menu>\r\n                    </ng-container>\r\n                    <ng-container\r\n                      *ngIf=\"column.type !== 'date' && column.type !== 'datetime' && column.type !== 'number' && column.type !== 'array'\">\r\n                      {{item[column.field]}}\r\n                    </ng-container>\r\n                  </span>\r\n                </td>\r\n              </tr>\r\n            </tbody>\r\n          </table>\r\n        </div>\r\n      </div>\r\n      <div class=\"sd-box-footer clearfix\">\r\n        <div style=\"display: flex; align-items: center; align-content: space-between;\">\r\n          <div style=\"flex: 1;\" [innerHTML]=\"option?.note\">\r\n          </div>\r\n          <div style=\"flex: 1;\">\r\n            <mat-paginator [length]=\"filteredItems?.length || 0\" hidePageSize>\r\n            </mat-paginator>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </sd-modal-body>\r\n  <sd-modal-footer *sdDesktop>\r\n    <div class=\"mr-auto\">\r\n      <sd-button class=\"mr-5\" (action)=\"upload()\" icon=\"file_upload\" [title]=\"'Upload' | sdTranslate\" size=\"sm\"\r\n        color=\"info\"></sd-button>\r\n      <sd-button class=\"mr-5\" (action)=\"downloadTemplate()\" icon=\"file_download\"\r\n        [title]=\"'Download template' | sdTranslate\" color=\"info\" size=\"sm\">\r\n      </sd-button>\r\n    </div>\r\n    <sd-button *ngIf=\"filteredItems?.length\" class=\"mr-5\" (action)=\"export()\" icon=\"get_app\"\r\n      [title]=\"'Download result' | sdTranslate\" size=\"sm\" color=\"info\">\r\n    </sd-button>\r\n    <sd-button (action)=\"accept()\" icon=\"check\" [title]=\"'Accept' | sdTranslate\"\r\n      [disabled]=\"numberOfSuccess === 0 || numberOfError > 0 || isUploaded\" color=\"success\" 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)=\"upload()\" icon=\"file_upload\"\r\n      [title]=\"'Upload' | sdTranslate\" width=\"100%\" size=\"sm\" color=\"info\"></sd-button>\r\n    <sd-button style=\"flex: 1; padding-left: 5px;\" (action)=\"accept()\" icon=\"check\" [title]=\"'Accept' | sdTranslate\"\r\n      [disabled]=\"numberOfSuccess === 0 || numberOfError > 0\" color=\"success\" width=\"100%\" size=\"sm\"></sd-button>\r\n  </sd-modal-footer>\r\n</sd-modal>","styles":[".table thead td,.table thead th{padding-bottom:5px;padding-top:5px}.table-striped tbody tr:nth-of-type(2n) .c-sticky-left{background-color:#fff}.table-striped tbody tr:nth-of-type(odd) .c-sticky-left{background-color:#f2f2f2}.c-sticky-left{border-left:none!important;border-right:none!important;left:0!important;z-index:20}.c-ellipsis{display:block;overflow:hidden!important;padding:.1rem;text-overflow:ellipsis;white-space:nowrap}.c-mat-menu{border:none}.c-mat-menu mat-icon{font-size:20px;vertical-align:middle}:host ::ng-deep .mat-paginator-container{height:32px;min-height:32px}:host ::ng-deep .mat-paginator-container .mat-icon-button{height:28px;line-height:28px;width:28px}"]}]}],"members":{"option":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"modal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":34,"character":3},"arguments":["modal"]}]}],"paginator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":47,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginator","line":47,"character":13}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":58,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/excel","name":"SdExcelService","line":59,"character":26},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateService","line":60,"character":30},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyService","line":61,"character":27},{"__symbolic":"reference","module":"@sd-angular/core/loading","name":"SdLoadingService","line":62,"character":28}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"SdUploadExcelModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":17,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":20,"character":4},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"ngx-device-detector","name":"DeviceDetectorModule","line":21,"character":4},"member":"forRoot"}},{"__symbolic":"reference","module":"@angular/material/slide-toggle","name":"MatSlideToggleModule","line":22,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":23,"character":4},{"__symbolic":"reference","module":"@angular/material/paginator","name":"MatPaginatorModule","line":24,"character":4},{"__symbolic":"reference","module":"@angular/material/slide-toggle","name":"MatSlideToggleModule","line":25,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/notify","name":"SdNotifyModule","line":26,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":27,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/utility","name":"SdUtilityModule","line":28,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/button","name":"SdButtonModule","line":29,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/modal","name":"SdModalModule","line":30,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/input","name":"SdInputModule","line":31,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":32,"character":4},{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuModule","line":33,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdUploadExcel"}],"exports":[{"__symbolic":"reference","name":"SdUploadExcel"}],"providers":[]}]}],"members":{}}},"origins":{"SdUploadExcelOption":"./src/lib/upload-excel.model","SdUploadExcelColumn":"./src/lib/upload-excel.model","SdUploadExcelBaseColumn":"./src/lib/upload-excel.model","SdUploadExcelColumnString":"./src/lib/upload-excel.model","SdUploadExcelColumnNumber":"./src/lib/upload-excel.model","SdUploadExcelColumnBool":"./src/lib/upload-excel.model","SdUploadExcelColumnDate":"./src/lib/upload-excel.model","SdUploadExcelColumnTime":"./src/lib/upload-excel.model","SdUploadExcelColumnDateTime":"./src/lib/upload-excel.model","SdUploadExcelColumnValues":"./src/lib/upload-excel.model","SdUploadExcelColumnStringArray":"./src/lib/upload-excel.model","SdUploadExcelValidation":"./src/lib/upload-excel.model","ExcelItem":"./src/lib/upload-excel.model","SdUploadExcel":"./src/lib/upload-excel.component","SdUploadExcelModule":"./src/lib/upload-excel.module"},"importAs":"@sd-angular/core/upload-excel"}

package/upload-excel/src/lib/upload-excel.component.d.ts

@@ -6,7 +6,6 @@ import { SdTranslateService } from '@sd-angular/core/translate';
 import { MatPaginator } from '@angular/material/paginator';
 import { SdModal } from '@sd-angular/core/modal';
 import { SdUploadExcelOption, SdUploadExcelValidation } from './upload-excel.model';
-import '@sd-angular/core/typing';
 export declare class SdUploadExcel implements OnInit, OnDestroy {
     #private;
     private ref;

package/upload-excel/src/lib/upload-excel.module.d.ts

@@ -1,3 +1,2 @@
-import '@sd-angular/core/typing';
 export declare class SdUploadExcelModule {
 }