@sd-angular/core 1.1.13 → 1.1.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/autocomplete/sd-angular-core-autocomplete.metadata.json +1 -1
  2. package/bundles/sd-angular-core-autocomplete.umd.js +1 -1
  3. package/bundles/sd-angular-core-autocomplete.umd.min.js +1 -1
  4. package/bundles/sd-angular-core-date-month.umd.js +9 -5
  5. package/bundles/sd-angular-core-date-month.umd.js.map +1 -1
  6. package/bundles/sd-angular-core-date-month.umd.min.js +2 -2
  7. package/bundles/sd-angular-core-date-month.umd.min.js.map +1 -1
  8. package/bundles/sd-angular-core-date-range.umd.js +13 -9
  9. package/bundles/sd-angular-core-date-range.umd.js.map +1 -1
  10. package/bundles/sd-angular-core-date-range.umd.min.js +2 -2
  11. package/bundles/sd-angular-core-date-range.umd.min.js.map +1 -1
  12. package/bundles/sd-angular-core-date-time.umd.js +1 -1
  13. package/bundles/sd-angular-core-date-time.umd.min.js +1 -1
  14. package/bundles/sd-angular-core-grid-material.umd.js +2 -2
  15. package/bundles/sd-angular-core-grid-material.umd.js.map +1 -1
  16. package/bundles/sd-angular-core-grid-material.umd.min.js +1 -1
  17. package/bundles/sd-angular-core-grid-material.umd.min.js.map +1 -1
  18. package/bundles/sd-angular-core-input-currency.umd.js +1 -1
  19. package/bundles/sd-angular-core-input-currency.umd.min.js +1 -1
  20. package/bundles/sd-angular-core-input.umd.js +1 -1
  21. package/bundles/sd-angular-core-input.umd.min.js +1 -1
  22. package/bundles/sd-angular-core-radio.umd.js +2 -2
  23. package/bundles/sd-angular-core-radio.umd.js.map +1 -1
  24. package/bundles/sd-angular-core-radio.umd.min.js +1 -1
  25. package/bundles/sd-angular-core-radio.umd.min.js.map +1 -1
  26. package/bundles/sd-angular-core-select.umd.js +1 -1
  27. package/bundles/sd-angular-core-select.umd.min.js +1 -1
  28. package/date-month/sd-angular-core-date-month.metadata.json +1 -1
  29. package/date-month/src/lib/date-month.component.d.ts +5 -2
  30. package/date-range/sd-angular-core-date-range.metadata.json +1 -1
  31. package/date-range/src/lib/date-range.component.d.ts +5 -1
  32. package/date-time/sd-angular-core-date-time.metadata.json +1 -1
  33. package/esm2015/autocomplete/src/lib/autocomplete.component.js +1 -1
  34. package/esm2015/date-month/src/lib/date-month.component.js +12 -8
  35. package/esm2015/date-range/src/lib/date-range.component.js +14 -9
  36. package/esm2015/date-time/src/lib/date-time.component.js +1 -1
  37. package/esm2015/grid-material/src/lib/components/grid-filter/grid-filter.component.js +2 -2
  38. package/esm2015/grid-material/src/lib/grid-material.component.js +2 -2
  39. package/esm2015/grid-material/src/lib/models/grid-sub-information.model.js +1 -1
  40. package/esm2015/input/src/lib/input.component.js +1 -1
  41. package/esm2015/input-currency/src/lib/input-currency.component.js +1 -1
  42. package/esm2015/radio/src/lib/radio.component.js +3 -3
  43. package/esm2015/select/src/lib/select.component.js +1 -1
  44. package/fesm2015/sd-angular-core-autocomplete.js +1 -1
  45. package/fesm2015/sd-angular-core-date-month.js +11 -7
  46. package/fesm2015/sd-angular-core-date-month.js.map +1 -1
  47. package/fesm2015/sd-angular-core-date-range.js +13 -9
  48. package/fesm2015/sd-angular-core-date-range.js.map +1 -1
  49. package/fesm2015/sd-angular-core-date-time.js +1 -1
  50. package/fesm2015/sd-angular-core-grid-material.js +2 -2
  51. package/fesm2015/sd-angular-core-grid-material.js.map +1 -1
  52. package/fesm2015/sd-angular-core-input-currency.js +1 -1
  53. package/fesm2015/sd-angular-core-input.js +1 -1
  54. package/fesm2015/sd-angular-core-radio.js +2 -2
  55. package/fesm2015/sd-angular-core-radio.js.map +1 -1
  56. package/fesm2015/sd-angular-core-select.js +1 -1
  57. package/grid-material/sd-angular-core-grid-material.metadata.json +1 -1
  58. package/grid-material/src/lib/grid-material.component.d.ts +1 -1
  59. package/grid-material/src/lib/models/grid-sub-information.model.d.ts +3 -2
  60. package/input/sd-angular-core-input.metadata.json +1 -1
  61. package/input-currency/sd-angular-core-input-currency.metadata.json +1 -1
  62. package/package.json +1 -1
  63. package/radio/sd-angular-core-radio.metadata.json +1 -1
  64. package/{sd-angular-core-1.1.13.tgz → sd-angular-core-1.1.16.tgz} +0 -0
  65. package/select/sd-angular-core-select.metadata.json +1 -1
@@ -233,7 +233,7 @@ _name = new WeakMap(), _form = new WeakMap(), _model = new WeakMap(), _align = n
233
233
  SdInputCurrency.decorators = [
234
234
  { type: Component, args: [{
235
235
  selector: 'sd-input-currency',
236
- template: "<label *ngIf=\"!appearance && label\" class=\"d-block pb-0 T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<div class=\"d-flex align-items-center\">\r\n <mat-form-field class=\"sd-md\"\r\n [ngClass]=\"{'sd-form-tooltip':tooltip, 'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\"\r\n [appearance]=\"appearance || 'outline'\">\r\n <mat-label *ngIf=\"appearance && label\">{{label}}</mat-label>\r\n <input currencyMask [options]=\"options\" [formControl]=\"formControl\" #control matInput\r\n [placeholder]=\"placeholder || label\" (keyup.enter)=\"onKeyupEnter()\" (focus)=\"onFocus()\" [required]=\"isRequired\"\r\n autocomplete=\"off\">\r\n <ng-container *ngIf=\"sdSuffix?.templateRef\" matSuffix>\r\n <ng-container *ngTemplateOutlet=\"sdSuffix.templateRef\">\r\n </ng-container>\r\n </ng-container>\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?.pattern && !disableErrorMessage\">\r\n {{'Pattern error' | sdTranslate}}\r\n </mat-error>\r\n <mat-error *ngIf=\"formControl.errors?.customValidator && !disableErrorMessage\">\r\n <strong>{{formControl.errors?.customValidator}}</strong>\r\n </mat-error>\r\n </mat-form-field>\r\n <div *ngIf=\"tooltip\" class=\"sd-tooltip\">\r\n <mat-icon (click)=\"sdTooltip.toggle()\" [matTooltip]=\"formControl.value | sdInputCurrencyTooltipPipe:tooltip\"\r\n matSuffix #sdTooltip=\"matTooltip\">info</mat-icon>\r\n </div>\r\n</div>",
236
+ template: "<label *ngIf=\"!appearance && label\" class=\"d-block mb-0 T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<div class=\"d-flex align-items-center\">\r\n <mat-form-field class=\"sd-md\"\r\n [ngClass]=\"{'sd-form-tooltip':tooltip, 'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\"\r\n [appearance]=\"appearance || 'outline'\">\r\n <mat-label *ngIf=\"appearance && label\">{{label}}</mat-label>\r\n <input currencyMask [options]=\"options\" [formControl]=\"formControl\" #control matInput\r\n [placeholder]=\"placeholder || label\" (keyup.enter)=\"onKeyupEnter()\" (focus)=\"onFocus()\" [required]=\"isRequired\"\r\n autocomplete=\"off\">\r\n <ng-container *ngIf=\"sdSuffix?.templateRef\" matSuffix>\r\n <ng-container *ngTemplateOutlet=\"sdSuffix.templateRef\">\r\n </ng-container>\r\n </ng-container>\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?.pattern && !disableErrorMessage\">\r\n {{'Pattern error' | sdTranslate}}\r\n </mat-error>\r\n <mat-error *ngIf=\"formControl.errors?.customValidator && !disableErrorMessage\">\r\n <strong>{{formControl.errors?.customValidator}}</strong>\r\n </mat-error>\r\n </mat-form-field>\r\n <div *ngIf=\"tooltip\" class=\"sd-tooltip\">\r\n <mat-icon (click)=\"sdTooltip.toggle()\" [matTooltip]=\"formControl.value | sdInputCurrencyTooltipPipe:tooltip\"\r\n matSuffix #sdTooltip=\"matTooltip\">info</mat-icon>\r\n </div>\r\n</div>",
237
237
  styles: [":host ::ng-deep .mat-form-field.sd-form-tooltip{width:calc(100% - 30px)}.sd-tooltip{display:inline-block;margin:auto;text-align:center;width:30px}:host{display:block;padding-top:5px}: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 input.mat-input-element:disabled{color:#4d4d4d!important}:host ::ng-deep .mat-form-field .mat-placeholder-required{color:#f82c13}"]
238
238
  },] }
239
239
  ];
@@ -268,7 +268,7 @@ _name = new WeakMap(), _form = new WeakMap(), _blurOnEnter_1 = new WeakMap(), _m
268
268
  SdInput.decorators = [
269
269
  { type: Component, args: [{
270
270
  selector: 'sd-input',
271
- template: "<label *ngIf=\"!appearance && label\" class=\"d-block pb-0 T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<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 *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value }\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #default>\r\n <mat-form-field class=\"sd-md\"\r\n [ngClass]=\"{'sd-form-tooltip':tooltip, 'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\"\r\n [appearance]=\"appearance || 'outline'\">\r\n <mat-label *ngIf=\"appearance && label\">{{label}}</mat-label>\r\n <input [id]=\"id\" [formControl]=\"formControl\" [type]=\"type\" #control matInput [placeholder]=\"placeholder || label\"\r\n (keyup.enter)=\"onKeyupEnter()\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [required]=\"isRequired\"\r\n [readonly]=\"isReadonly\" [autocomplete]=\"id\" autocorrect=\"off\" [step]=\"1\">\r\n <button #btnCopy *ngIf=\"copyable\" matSuffix mat-flat-button aria-label=\"Clear\" class=\"btn-copy\"\r\n (click)=\"copyText()\">\r\n Copy\r\n </button>\r\n <span class=\"mr-1\" *ngIf=\"maxlength\" matSuffix>{{formControl.value?.length || 0}}/{{maxlength}}</span>\r\n <ng-container *ngIf=\"sdInputSuffix?.templateRef\" matSuffix>\r\n <ng-container *ngTemplateOutlet=\"sdInputSuffix.templateRef\">\r\n </ng-container>\r\n </ng-container>\r\n <mat-icon *ngIf=\"!hideIcon && sdClickIcon?.observers?.length\" (click)=\"onClickIcon($event)\"\r\n class=\"pointer sd-suffix-icon\" matSuffix>\r\n {{icon}}\r\n </mat-icon>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.required\">\r\n {{'This field is required' | sdTranslate}}\r\n </mat-error>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.maxlength\">\r\n {{'Max length' | sdTranslate}} <strong>{{maxlength}}</strong>\r\n </mat-error>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.pattern\">\r\n {{'Pattern error' | sdTranslate}}\r\n </mat-error>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.customValidator\">\r\n {{formControl.errors?.customValidator}}\r\n </mat-error>\r\n </mat-form-field>\r\n <div *ngIf=\"tooltip\" class=\"sd-tooltip\">\r\n <mat-icon (click)=\"sdTooltip.toggle()\" [matTooltip]=\"formControl.value | sdInputTooltipPipe:tooltip\" matSuffix\r\n #sdTooltip=\"matTooltip\">info</mat-icon>\r\n </div>\r\n </ng-template>\r\n</div>",
271
+ template: "<label *ngIf=\"!appearance && label\" class=\"d-block mb-0 T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<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 *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value }\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #default>\r\n <mat-form-field class=\"sd-md\"\r\n [ngClass]=\"{'sd-form-tooltip':tooltip, 'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\"\r\n [appearance]=\"appearance || 'outline'\">\r\n <mat-label *ngIf=\"appearance && label\">{{label}}</mat-label>\r\n <input [id]=\"id\" [formControl]=\"formControl\" [type]=\"type\" #control matInput [placeholder]=\"placeholder || label\"\r\n (keyup.enter)=\"onKeyupEnter()\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [required]=\"isRequired\"\r\n [readonly]=\"isReadonly\" [autocomplete]=\"id\" autocorrect=\"off\" [step]=\"1\">\r\n <button #btnCopy *ngIf=\"copyable\" matSuffix mat-flat-button aria-label=\"Clear\" class=\"btn-copy\"\r\n (click)=\"copyText()\">\r\n Copy\r\n </button>\r\n <span class=\"mr-1\" *ngIf=\"maxlength\" matSuffix>{{formControl.value?.length || 0}}/{{maxlength}}</span>\r\n <ng-container *ngIf=\"sdInputSuffix?.templateRef\" matSuffix>\r\n <ng-container *ngTemplateOutlet=\"sdInputSuffix.templateRef\">\r\n </ng-container>\r\n </ng-container>\r\n <mat-icon *ngIf=\"!hideIcon && sdClickIcon?.observers?.length\" (click)=\"onClickIcon($event)\"\r\n class=\"pointer sd-suffix-icon\" matSuffix>\r\n {{icon}}\r\n </mat-icon>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.required\">\r\n {{'This field is required' | sdTranslate}}\r\n </mat-error>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.maxlength\">\r\n {{'Max length' | sdTranslate}} <strong>{{maxlength}}</strong>\r\n </mat-error>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.pattern\">\r\n {{'Pattern error' | sdTranslate}}\r\n </mat-error>\r\n <mat-error *ngIf=\"!disableErrorMessage && formControl.touched && formControl.errors?.customValidator\">\r\n {{formControl.errors?.customValidator}}\r\n </mat-error>\r\n </mat-form-field>\r\n <div *ngIf=\"tooltip\" class=\"sd-tooltip\">\r\n <mat-icon (click)=\"sdTooltip.toggle()\" [matTooltip]=\"formControl.value | sdInputTooltipPipe:tooltip\" matSuffix\r\n #sdTooltip=\"matTooltip\">info</mat-icon>\r\n </div>\r\n </ng-template>\r\n</div>",
272
272
  changeDetection: ChangeDetectionStrategy.OnPush,
273
273
  styles: [":host ::ng-deep .mat-form-field.sd-form-tooltip{width:calc(100% - 30px)}: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 input.mat-input-element:disabled{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}.sd-tooltip{display:inline-block;margin:auto;text-align:center;width:30px}:host{display:block;padding-top:5px}.sd-md:hover .btn-copy{visibility:visible}.btn-copy{background:#e9e9e9!important;font-size:12px;line-height:26px!important;margin-bottom:3px;visibility:hidden}"]
274
274
  },] }
@@ -142,9 +142,9 @@ _name = new WeakMap(), _form = new WeakMap(), _model = new WeakMap(), _required
142
142
  SdRadio.decorators = [
143
143
  { type: Component, args: [{
144
144
  selector: 'sd-radio',
145
- template: "<section [ngClass]=\"{'c-section': display == 'row'}\">\r\n <label *ngIf=\"label\" class=\"d-block T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n <mat-radio-group [ngClass]=\"{'c-radio-group-column': display == 'column', 'c-radio-group-row': display == 'row'}\"\r\n [formControl]=\"formControl\">\r\n <mat-radio-button color=\"primary\" [ngClass]=\"{'m-0': display == 'column', 'mr-16': display == 'row'}\"\r\n *ngFor=\"let item of items\" [value]=\"item[valueField]\">\r\n {{item[displayField]}}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n</section>",
145
+ template: "<section [ngClass]=\"{'c-section': display == 'row'}\">\r\n <label *ngIf=\"label\" class=\"d-block T14M\" [class.mb-0]=\"display === 'row'\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n <mat-radio-group [ngClass]=\"{'c-radio-group-column': display === 'column', 'c-radio-group-row': display === 'row'}\"\r\n [formControl]=\"formControl\">\r\n <mat-radio-button color=\"primary\" [ngClass]=\"{'m-0': display === 'column', 'mr-16': display === 'row'}\"\r\n *ngFor=\"let item of items\" [value]=\"item[valueField]\">\r\n {{item[displayField]}}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n</section>",
146
146
  changeDetection: ChangeDetectionStrategy.OnPush,
147
- styles: [".c-section{align-content:center;align-items:center}.c-radio-group-column{display:flex;flex-direction:column}.c-radio-group-row{display:flex;flex-direction:row}"]
147
+ styles: [":host{display:flex;flex-direction:column;height:100%}.c-section{align-content:center;align-items:center}.c-radio-group-column{align-items:flex-start;display:flex;flex:1;flex-direction:column}.c-radio-group-row{align-items:center;display:flex;flex:1;flex-direction:row}"]
148
148
  },] }
149
149
  ];
150
150
  SdRadio.ctorParameters = () => [
@@ -1 +1 @@
1
- {"version":3,"file":"sd-angular-core-radio.js","sources":["../../../../projects/sd-core/radio/src/lib/radio.component.ts","../../../../projects/sd-core/radio/src/lib/radio.module.ts","../../../../projects/sd-core/radio/sd-angular-core-radio.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy, OnInit, ChangeDetectionStrategy } from '@angular/core';\r\nimport { NgForm, Validators, ValidatorFn, FormGroup } from '@angular/forms';\r\nimport { SdFormControl } from '@sd-angular/core/common';\r\nimport { Subscription } from 'rxjs';\r\nimport * as uuid from 'uuid';\r\n\r\n@Component({\r\n selector: 'sd-radio',\r\n templateUrl: './radio.component.html',\r\n styleUrls: ['./radio.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class SdRadio implements OnInit, AfterViewInit, OnDestroy {\r\n #name = uuid.v4();\r\n @Input() set name(val: string) {\r\n if (val) {\r\n this.#name = val;\r\n }\r\n }\r\n formControl = new SdFormControl();\r\n // get isNumber() {\r\n // if (this.#model || this.#model === 0) {\r\n // return typeof (this.#model) === 'number';\r\n // }\r\n // if (this.items?.length) {\r\n // if (this.valueField) {\r\n // return typeof (this.items[0][this.valueField]) === 'number';\r\n // } else {\r\n // return typeof (this.items[0]) === 'number';\r\n // }\r\n // }\r\n // return false;\r\n // }\r\n #form: FormGroup;\r\n @Input() set form(val: NgForm | FormGroup) {\r\n if (val) {\r\n if (val instanceof NgForm) {\r\n this.#form = val.form;\r\n } else {\r\n this.#form = val;\r\n }\r\n }\r\n }\r\n @Input() label: string;\r\n @Input() placeholder: string;\r\n @Input() display: 'row' | 'column' = 'row';\r\n // Model\r\n #model: number | string;\r\n @Input() set model(value: number | string) {\r\n this.#model = value;\r\n if (value !== this.formControl.value) {\r\n this.formControl.setValue(value, {\r\n emitEvent: false\r\n });\r\n }\r\n }\r\n // Items\r\n items: any[] = [];\r\n @Input('items') set pItems(items: any[]) {\r\n if (!Array.isArray(items)) {\r\n this.items = [];\r\n }\r\n this.items = items;\r\n }\r\n @Input() valueField: string;\r\n @Input() displayField: string;\r\n\r\n // Validator\r\n #required = false;\r\n @Input() set required(val: boolean | '') {\r\n this.#required = (val === '') || val;\r\n this.#updateValidator();\r\n }\r\n // Optional\r\n @Input() set disabled(val: boolean | '') {\r\n val = (val === '') || val;\r\n if (val) {\r\n this.formControl.disable();\r\n } else {\r\n this.formControl.enable();\r\n }\r\n }\r\n @Output() modelChange = new EventEmitter();\r\n @Output() sdChange = new EventEmitter();\r\n @Output() sdSelection = new EventEmitter<{ value: any | any[], item?: any }>();\r\n #subscription = new Subscription();\r\n constructor(\r\n public ref: ChangeDetectorRef\r\n ) { }\r\n\r\n ngOnInit() {\r\n this.#subscription.add(this.formControl.sdChanges.subscribe(() => {\r\n // this.formControl.updateValueAndValidity();\r\n this.ref.markForCheck();\r\n }));\r\n }\r\n\r\n ngAfterViewInit() {\r\n this.#subscription.add(this.formControl.valueChanges.subscribe(value => {\r\n let val = value;\r\n // if (this.isNumber && Number.isNumber(value)) {\r\n // val = +value;\r\n // }\r\n this.modelChange.emit(val);\r\n this.sdChange.emit(val);\r\n this.sdSelection.emit({\r\n value: val,\r\n item: this.items?.find(e => val?.toString() === e?.[this.valueField]?.toString())\r\n });\r\n }));\r\n if((this.#model === undefined || this.#model === null) && this.#required) {\r\n setTimeout(() => {\r\n if(this.valueField) {\r\n this.formControl.setValue(this.items[0]?.[this.valueField]);\r\n } else {\r\n this.formControl.setValue(this.items[0]);\r\n }\r\n });\r\n }\r\n this.#form?.addControl(this.#name, this.formControl);\r\n }\r\n\r\n ngOnDestroy() {\r\n this.#subscription.unsubscribe();\r\n this.#form?.removeControl(this.#name);\r\n }\r\n\r\n #updateValidator = () => {\r\n this.formControl.clearValidators();\r\n const validators: ValidatorFn[] = [];\r\n if (this.#required) {\r\n validators.push(Validators.required);\r\n }\r\n this.formControl.setValidators(validators);\r\n this.formControl.updateValueAndValidity();\r\n }\r\n\r\n reValidate = () => {\r\n this.formControl.updateValueAndValidity({ emitEvent: true });\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ReactiveFormsModule } from '@angular/forms';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdRadio } from './radio.component';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { MatRadioModule } from '@angular/material/radio';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n ReactiveFormsModule,\r\n MatTooltipModule,\r\n MatFormFieldModule,\r\n MatIconModule,\r\n MatRadioModule,\r\n SdTranslateModule\r\n ],\r\n declarations: [\r\n SdRadio\r\n ],\r\n exports: [\r\n SdRadio\r\n ],\r\n providers: [\r\n ]\r\n})\r\nexport class SdRadioModule {\r\n\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}
1
+ {"version":3,"file":"sd-angular-core-radio.js","sources":["../../../../projects/sd-core/radio/src/lib/radio.component.ts","../../../../projects/sd-core/radio/src/lib/radio.module.ts","../../../../projects/sd-core/radio/sd-angular-core-radio.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy, OnInit, ChangeDetectionStrategy } from '@angular/core';\r\nimport { NgForm, Validators, ValidatorFn, FormGroup } from '@angular/forms';\r\nimport { SdFormControl } from '@sd-angular/core/common';\r\nimport { Subscription } from 'rxjs';\r\nimport * as uuid from 'uuid';\r\n\r\n@Component({\r\n selector: 'sd-radio',\r\n templateUrl: './radio.component.html',\r\n styleUrls: ['./radio.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class SdRadio implements OnInit, AfterViewInit, OnDestroy {\r\n #name = uuid.v4();\r\n @Input() set name(val: string) {\r\n if (val) {\r\n this.#name = val;\r\n }\r\n }\r\n formControl = new SdFormControl();\r\n // get isNumber() {\r\n // if (this.#model || this.#model === 0) {\r\n // return typeof (this.#model) === 'number';\r\n // }\r\n // if (this.items?.length) {\r\n // if (this.valueField) {\r\n // return typeof (this.items[0][this.valueField]) === 'number';\r\n // } else {\r\n // return typeof (this.items[0]) === 'number';\r\n // }\r\n // }\r\n // return false;\r\n // }\r\n #form: FormGroup;\r\n @Input() set form(val: NgForm | FormGroup) {\r\n if (val) {\r\n if (val instanceof NgForm) {\r\n this.#form = val.form;\r\n } else {\r\n this.#form = val;\r\n }\r\n }\r\n }\r\n @Input() label: string;\r\n @Input() placeholder: string;\r\n @Input() display: 'row' | 'column' = 'row';\r\n // Model\r\n #model: number | string;\r\n @Input() set model(value: number | string) {\r\n this.#model = value;\r\n if (value !== this.formControl.value) {\r\n this.formControl.setValue(value, {\r\n emitEvent: false\r\n });\r\n }\r\n }\r\n // Items\r\n items: any[] = [];\r\n @Input('items') set pItems(items: any[]) {\r\n if (!Array.isArray(items)) {\r\n this.items = [];\r\n }\r\n this.items = items;\r\n }\r\n @Input() valueField: string;\r\n @Input() displayField: string;\r\n\r\n // Validator\r\n #required = false;\r\n @Input() set required(val: boolean | '') {\r\n this.#required = (val === '') || val;\r\n this.#updateValidator();\r\n }\r\n // Optional\r\n @Input() set disabled(val: boolean | '') {\r\n val = (val === '') || val;\r\n if (val) {\r\n this.formControl.disable();\r\n } else {\r\n this.formControl.enable();\r\n }\r\n }\r\n @Output() modelChange = new EventEmitter();\r\n @Output() sdChange = new EventEmitter();\r\n @Output() sdSelection = new EventEmitter<{ value: any | any[], item?: any }>();\r\n #subscription = new Subscription();\r\n constructor(\r\n public ref: ChangeDetectorRef\r\n ) { }\r\n\r\n ngOnInit() {\r\n this.#subscription.add(this.formControl.sdChanges.subscribe(() => {\r\n // this.formControl.updateValueAndValidity();\r\n this.ref.markForCheck();\r\n }));\r\n }\r\n\r\n ngAfterViewInit() {\r\n this.#subscription.add(this.formControl.valueChanges.subscribe(value => {\r\n let val = value;\r\n // if (this.isNumber && Number.isNumber(value)) {\r\n // val = +value;\r\n // }\r\n this.modelChange.emit(val);\r\n this.sdChange.emit(val);\r\n this.sdSelection.emit({\r\n value: val,\r\n item: this.items?.find(e => val?.toString() === e?.[this.valueField]?.toString())\r\n });\r\n }));\r\n if((this.#model === undefined || this.#model === null) && this.#required) {\r\n setTimeout(() => {\r\n if(this.valueField) {\r\n this.formControl.setValue(this.items[0]?.[this.valueField]);\r\n } else {\r\n this.formControl.setValue(this.items[0]);\r\n }\r\n });\r\n }\r\n this.#form?.addControl(this.#name, this.formControl);\r\n }\r\n\r\n ngOnDestroy() {\r\n this.#subscription.unsubscribe();\r\n this.#form?.removeControl(this.#name);\r\n }\r\n\r\n #updateValidator = () => {\r\n this.formControl.clearValidators();\r\n const validators: ValidatorFn[] = [];\r\n if (this.#required) {\r\n validators.push(Validators.required);\r\n }\r\n this.formControl.setValidators(validators);\r\n this.formControl.updateValueAndValidity();\r\n }\r\n\r\n reValidate = () => {\r\n this.formControl.updateValueAndValidity({ emitEvent: true });\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ReactiveFormsModule } from '@angular/forms';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdRadio } from './radio.component';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { MatRadioModule } from '@angular/material/radio';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n ReactiveFormsModule,\r\n MatTooltipModule,\r\n MatFormFieldModule,\r\n MatIconModule,\r\n MatRadioModule,\r\n SdTranslateModule\r\n ],\r\n declarations: [\r\n SdRadio\r\n ],\r\n exports: [\r\n SdRadio\r\n ],\r\n providers: [\r\n ]\r\n})\r\nexport class SdRadioModule {\r\n\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}
@@ -393,7 +393,7 @@ _input = new WeakMap(), _name = new WeakMap(), _form = new WeakMap(), _itemsChan
393
393
  SdSelect.decorators = [
394
394
  { type: Component, args: [{
395
395
  selector: 'sd-select',
396
- template: "<label *ngIf=\"!appearance && label\" class=\"d-block pb-0 T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<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 | async }\">\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]=\"appearance || 'outline'\">\r\n <mat-label *ngIf=\"appearance && 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\u1EA5t c\u1EA3</mat-checkbox>\r\n </ng-container>\r\n <ng-container *ngIf=\"valueField && displayField\">\r\n <mat-option *ngFor=\"let item of filteredItems | async; trackBy: trackByKey\" [value]=\"item[valueField]\">\r\n <div matTooltipPosition=\"above\" [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 </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; trackBy: trackByKey\" [value]=\"item\">\r\n <div matTooltipPosition=\"above\" [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 </div>\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; trackBy: trackByKey\" [value]=\"item[valueField]\">\r\n <div matTooltipPosition=\"above\" [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 </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; trackBy: trackByKey\" [value]=\"item\">\r\n <div matTooltipPosition=\"above\" [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 </div>\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>",
396
+ template: "<label *ngIf=\"!appearance && label\" class=\"d-block mb-0 T14M\">{{label}} <span class=\"text-danger mb-2\" *ngIf=\"required\">*</span></label>\r\n<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 | async }\">\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]=\"appearance || 'outline'\">\r\n <mat-label *ngIf=\"appearance && 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\u1EA5t c\u1EA3</mat-checkbox>\r\n </ng-container>\r\n <ng-container *ngIf=\"valueField && displayField\">\r\n <mat-option *ngFor=\"let item of filteredItems | async; trackBy: trackByKey\" [value]=\"item[valueField]\">\r\n <div matTooltipPosition=\"above\" [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 </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; trackBy: trackByKey\" [value]=\"item\">\r\n <div matTooltipPosition=\"above\" [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 </div>\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; trackBy: trackByKey\" [value]=\"item[valueField]\">\r\n <div matTooltipPosition=\"above\" [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 </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; trackBy: trackByKey\" [value]=\"item\">\r\n <div matTooltipPosition=\"above\" [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 </div>\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>",
397
397
  changeDetection: ChangeDetectionStrategy.OnPush,
398
398
  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)}"]
399
399
  },] }