npm - @sd-angular/core - Versions diffs - 19.0.0-beta.11 → 19.0.0-beta.13 - Mend

@sd-angular/core 19.0.0-beta.11 → 19.0.0-beta.13

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 (24) hide show

package/fesm2022/sd-angular-core-forms-autocomplete.mjs CHANGED Viewed

@@ -404,7 +404,7 @@ class SdAutocomplete {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdAutocomplete, deps: [{ token: i0.ChangeDetectorRef }, { token: SD_FORM_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: SdAutocomplete, isStandalone: true, selector: "sd-autocomplete", inputs: { _autoId: ["autoId", "_autoId"], name: "name", appearance: "appearance", size: "size", form: "form", _label: ["label", "_label"], _helperText: ["helperText", "_helperText"], valueField: "valueField", displayField: "displayField", disabledField: "disabledField", placeholder: "placeholder", items: "items", limit: "limit", cacheChecksum: "cacheChecksum", model: "model", _addable: ["addable", "_addable"], disabled: "disabled", _viewed: ["viewed", "_viewed"], hyperlink: "hyperlink", _required: ["required", "_required"], _validator: ["validator", "_validator"], _inlineError: ["inlineError", "_inlineError"], _hideInlineError: ["hideInlineError", "_hideInlineError"] }, outputs: { modelChange: "modelChange", sdChange: "sdChange", sdSelection: "sdSelection", sdAdd: "sdAdd" }, queries: [{ propertyName: "itemDef", first: true, predicate: SdItemDefDefDirective, descendants: true }, { propertyName: "sdLabelDef", first: true, predicate: SdLabelDefDirective, descendants: true }, { propertyName: "sdViewDef", first: true, predicate: SdViewDefDirective, descendants: true }], viewQueries: [{ propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true, read: MatAutocompleteTrigger }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ display | async }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T16M\">{{ display | async | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !autocompleteTrigger?.panelOpen && !isFocused) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value,\r\n            selectedItem: selected | async,\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [floatLabel]=\"formControl.value ? 'always' : 'auto'\"\r\n        [appearance]=\"appearance || 'outline'\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          [id]=\"id\"\r\n          [formControl]=\"inputControl\"\r\n          [placeholder]=\"(controlPlaceHolder | async) || ''\"\r\n          [class.c-selected]=\"formControl.value\"\r\n          [matAutocomplete]=\"auto\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          matInput\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [errorStateMatcher]=\"matcher\"\r\n          [required]=\"required\"\r\n          #input\r\n          #autocompleteTrigger\r\n          [attr.data-autoId]=\"autoId\"\r\n          aria-hidden=\"true\" />\r\n        @if (!loading && formControl.value && !inputControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel</mat-icon>\r\n        } @else if (loading) {\r\n          <mat-spinner [diameter]=\"20\" matSuffix></mat-spinner>\r\n        } @else {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" matSuffix>search</mat-icon>\r\n        }\r\n        <!-- <i [class.d-none]=\"!loading\" class=\"fa fa-spinner fa-pulse c-loading-icon\"></i> -->\r\n        <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelect($event.option.value)\">\r\n          @let items = filteredItems | async;\r\n          @if (items?.length) {\r\n            <mat-option\r\n              *ngFor=\"let item of items\"\r\n              [value]=\"item\"\r\n              matTooltipPosition=\"above\"\r\n              [matTooltip]=\"displayField ? item[displayField] : item\"\r\n              [disabled]=\"item[disabledField]\">\r\n              <ng-container *ngIf=\"itemDef?.templateRef\">\r\n                <ng-container *ngTemplateOutlet=\"itemDef?.templateRef ?? null; context: { item: item }\"> </ng-container>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"!itemDef?.templateRef\">\r\n                {{ displayField ? item[displayField] : item }}\r\n              </ng-container>\r\n            </mat-option>\r\n          } @else if (!items?.length && inputControl.value && !isTyping && !loading) {}\r\n          @if (addable && sdAdd.observers.length) {\r\n            <mat-option class=\"sd__option--add\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n              <div (click)=\"onAdd($event)\">\r\n                <mat-icon class=\"mr-1\">add</mat-icon>\r\n                {{ 'New item' }}\r\n              </div>\r\n            </mat-option>\r\n          }\r\n        </mat-autocomplete>\r\n        @if (formControl.errors?.['required']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              Vui l\u00F2ng nh\u1EADp th\u00F4ng tin\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.c-selected::placeholder{color:#000;opacity:1}:host ::ng-deep .mat-mdc-form-field input.c-selected:-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.c-selected::-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected:-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field:hover .icon-copy{opacity:1}:host ::ng-deep .mat-mdc-form-field .icon-copy{cursor:pointer;width:.9em;height:.9em;fill:#00000080;transition:opacity .2s linear;opacity:0}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}.sd__option--add{position:sticky;bottom:0;background-color:#fff;z-index:10;color:#000000de;cursor:pointer!important}.c-loading-icon{position:absolute;right:5px;top:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: SdLabel, selector: "sd-label", inputs: ["label", "description", "required", "helperText"] }, { kind: "pipe", type: SdEmptyPipe, name: "sdEmpty" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: SdAutocomplete, isStandalone: true, selector: "sd-autocomplete", inputs: { _autoId: ["autoId", "_autoId"], name: "name", appearance: "appearance", size: "size", form: "form", _label: ["label", "_label"], _helperText: ["helperText", "_helperText"], valueField: "valueField", displayField: "displayField", disabledField: "disabledField", placeholder: "placeholder", items: "items", limit: "limit", cacheChecksum: "cacheChecksum", model: "model", _addable: ["addable", "_addable"], disabled: "disabled", _viewed: ["viewed", "_viewed"], hyperlink: "hyperlink", _required: ["required", "_required"], _validator: ["validator", "_validator"], _inlineError: ["inlineError", "_inlineError"], _hideInlineError: ["hideInlineError", "_hideInlineError"] }, outputs: { modelChange: "modelChange", sdChange: "sdChange", sdSelection: "sdSelection", sdAdd: "sdAdd" }, queries: [{ propertyName: "itemDef", first: true, predicate: SdItemDefDefDirective, descendants: true }, { propertyName: "sdLabelDef", first: true, predicate: SdLabelDefDirective, descendants: true }, { propertyName: "sdViewDef", first: true, predicate: SdViewDefDirective, descendants: true }], viewQueries: [{ propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true, read: MatAutocompleteTrigger }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ display | async }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T14M\">{{ display | async | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !autocompleteTrigger?.panelOpen && !isFocused) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value,\r\n            selectedItem: selected | async,\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [floatLabel]=\"formControl.value ? 'always' : 'auto'\"\r\n        [appearance]=\"appearance || 'outline'\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          [id]=\"id\"\r\n          [formControl]=\"inputControl\"\r\n          [placeholder]=\"(controlPlaceHolder | async) || ''\"\r\n          [class.c-selected]=\"formControl.value\"\r\n          [matAutocomplete]=\"auto\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          matInput\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [errorStateMatcher]=\"matcher\"\r\n          [required]=\"required\"\r\n          #input\r\n          #autocompleteTrigger\r\n          [attr.data-autoId]=\"autoId\"\r\n          aria-hidden=\"true\" />\r\n        @if (!loading && formControl.value && !inputControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel</mat-icon>\r\n        } @else if (loading) {\r\n          <mat-spinner [diameter]=\"20\" matSuffix></mat-spinner>\r\n        } @else {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" matSuffix>search</mat-icon>\r\n        }\r\n        <!-- <i [class.d-none]=\"!loading\" class=\"fa fa-spinner fa-pulse c-loading-icon\"></i> -->\r\n        <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelect($event.option.value)\" class=\"sd-autocomplete-panel\">\r\n          @let items = filteredItems | async;\r\n          @if (items?.length) {\r\n            <mat-option\r\n              *ngFor=\"let item of items\"\r\n              [value]=\"item\"\r\n              matTooltipPosition=\"above\"\r\n              [matTooltip]=\"displayField ? item[displayField] : item\"\r\n              [disabled]=\"item[disabledField]\">\r\n              <ng-container *ngIf=\"itemDef?.templateRef\">\r\n                <ng-container *ngTemplateOutlet=\"itemDef?.templateRef ?? null; context: { item: item }\"> </ng-container>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"!itemDef?.templateRef\">\r\n                {{ displayField ? item[displayField] : item }}\r\n              </ng-container>\r\n            </mat-option>\r\n          } @else if (!items?.length && inputControl.value && !isTyping && !loading) {}\r\n          @if (addable && sdAdd.observers.length) {\r\n            <mat-option class=\"sd__option--add\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n              <div (click)=\"onAdd($event)\">\r\n                <mat-icon class=\"mr-1\">add</mat-icon>\r\n                {{ 'New item' }}\r\n              </div>\r\n            </mat-option>\r\n          }\r\n        </mat-autocomplete>\r\n        @if (formControl.errors?.['required']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              Vui l\u00F2ng nh\u1EADp th\u00F4ng tin\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.c-selected::placeholder{color:#000;opacity:1}:host ::ng-deep .mat-mdc-form-field input.c-selected:-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.c-selected::-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected:-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field:hover .icon-copy{opacity:1}:host ::ng-deep .mat-mdc-form-field .icon-copy{cursor:pointer;width:.9em;height:.9em;fill:#00000080;transition:opacity .2s linear;opacity:0}::ng-deep .sd-autocomplete-panel .mat-mdc-option{min-height:36px!important;height:36px!important;padding-left:12px!important;padding-right:12px!important}::ng-deep .sd-autocomplete-panel .mdc-list-item__primary-text{font-size:14px!important;line-height:normal}::ng-deep .sd-autocomplete-panel .mat-pseudo-checkbox{transform:scale(.75);margin-right:8px!important}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}.sd__option--add{position:sticky;bottom:0;background-color:#fff;z-index:10;color:#000000de;cursor:pointer!important}.c-loading-icon{position:absolute;right:5px;top:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: SdLabel, selector: "sd-label", inputs: ["label", "description", "required", "helperText"] }, { kind: "pipe", type: SdEmptyPipe, name: "sdEmpty" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdAutocomplete, decorators: [{
             type: Component,
@@ -420,7 +420,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                         MatProgressSpinnerModule,
                         SdLabel,
                         SdEmptyPipe
-                    ], template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ display | async }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T16M\">{{ display | async | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !autocompleteTrigger?.panelOpen && !isFocused) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value,\r\n            selectedItem: selected | async,\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [floatLabel]=\"formControl.value ? 'always' : 'auto'\"\r\n        [appearance]=\"appearance || 'outline'\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          [id]=\"id\"\r\n          [formControl]=\"inputControl\"\r\n          [placeholder]=\"(controlPlaceHolder | async) || ''\"\r\n          [class.c-selected]=\"formControl.value\"\r\n          [matAutocomplete]=\"auto\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          matInput\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [errorStateMatcher]=\"matcher\"\r\n          [required]=\"required\"\r\n          #input\r\n          #autocompleteTrigger\r\n          [attr.data-autoId]=\"autoId\"\r\n          aria-hidden=\"true\" />\r\n        @if (!loading && formControl.value && !inputControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel</mat-icon>\r\n        } @else if (loading) {\r\n          <mat-spinner [diameter]=\"20\" matSuffix></mat-spinner>\r\n        } @else {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" matSuffix>search</mat-icon>\r\n        }\r\n        <!-- <i [class.d-none]=\"!loading\" class=\"fa fa-spinner fa-pulse c-loading-icon\"></i> -->\r\n        <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelect($event.option.value)\">\r\n          @let items = filteredItems | async;\r\n          @if (items?.length) {\r\n            <mat-option\r\n              *ngFor=\"let item of items\"\r\n              [value]=\"item\"\r\n              matTooltipPosition=\"above\"\r\n              [matTooltip]=\"displayField ? item[displayField] : item\"\r\n              [disabled]=\"item[disabledField]\">\r\n              <ng-container *ngIf=\"itemDef?.templateRef\">\r\n                <ng-container *ngTemplateOutlet=\"itemDef?.templateRef ?? null; context: { item: item }\"> </ng-container>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"!itemDef?.templateRef\">\r\n                {{ displayField ? item[displayField] : item }}\r\n              </ng-container>\r\n            </mat-option>\r\n          } @else if (!items?.length && inputControl.value && !isTyping && !loading) {}\r\n          @if (addable && sdAdd.observers.length) {\r\n            <mat-option class=\"sd__option--add\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n              <div (click)=\"onAdd($event)\">\r\n                <mat-icon class=\"mr-1\">add</mat-icon>\r\n                {{ 'New item' }}\r\n              </div>\r\n            </mat-option>\r\n          }\r\n        </mat-autocomplete>\r\n        @if (formControl.errors?.['required']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              Vui l\u00F2ng nh\u1EADp th\u00F4ng tin\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.c-selected::placeholder{color:#000;opacity:1}:host ::ng-deep .mat-mdc-form-field input.c-selected:-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.c-selected::-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected:-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field:hover .icon-copy{opacity:1}:host ::ng-deep .mat-mdc-form-field .icon-copy{cursor:pointer;width:.9em;height:.9em;fill:#00000080;transition:opacity .2s linear;opacity:0}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}.sd__option--add{position:sticky;bottom:0;background-color:#fff;z-index:10;color:#000000de;cursor:pointer!important}.c-loading-icon{position:absolute;right:5px;top:5px}\n"] }]
+                    ], template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ display | async }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T14M\">{{ display | async | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !autocompleteTrigger?.panelOpen && !isFocused) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value,\r\n            selectedItem: selected | async,\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [floatLabel]=\"formControl.value ? 'always' : 'auto'\"\r\n        [appearance]=\"appearance || 'outline'\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          [id]=\"id\"\r\n          [formControl]=\"inputControl\"\r\n          [placeholder]=\"(controlPlaceHolder | async) || ''\"\r\n          [class.c-selected]=\"formControl.value\"\r\n          [matAutocomplete]=\"auto\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          matInput\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [errorStateMatcher]=\"matcher\"\r\n          [required]=\"required\"\r\n          #input\r\n          #autocompleteTrigger\r\n          [attr.data-autoId]=\"autoId\"\r\n          aria-hidden=\"true\" />\r\n        @if (!loading && formControl.value && !inputControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel</mat-icon>\r\n        } @else if (loading) {\r\n          <mat-spinner [diameter]=\"20\" matSuffix></mat-spinner>\r\n        } @else {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" matSuffix>search</mat-icon>\r\n        }\r\n        <!-- <i [class.d-none]=\"!loading\" class=\"fa fa-spinner fa-pulse c-loading-icon\"></i> -->\r\n        <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelect($event.option.value)\" class=\"sd-autocomplete-panel\">\r\n          @let items = filteredItems | async;\r\n          @if (items?.length) {\r\n            <mat-option\r\n              *ngFor=\"let item of items\"\r\n              [value]=\"item\"\r\n              matTooltipPosition=\"above\"\r\n              [matTooltip]=\"displayField ? item[displayField] : item\"\r\n              [disabled]=\"item[disabledField]\">\r\n              <ng-container *ngIf=\"itemDef?.templateRef\">\r\n                <ng-container *ngTemplateOutlet=\"itemDef?.templateRef ?? null; context: { item: item }\"> </ng-container>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"!itemDef?.templateRef\">\r\n                {{ displayField ? item[displayField] : item }}\r\n              </ng-container>\r\n            </mat-option>\r\n          } @else if (!items?.length && inputControl.value && !isTyping && !loading) {}\r\n          @if (addable && sdAdd.observers.length) {\r\n            <mat-option class=\"sd__option--add\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n              <div (click)=\"onAdd($event)\">\r\n                <mat-icon class=\"mr-1\">add</mat-icon>\r\n                {{ 'New item' }}\r\n              </div>\r\n            </mat-option>\r\n          }\r\n        </mat-autocomplete>\r\n        @if (formControl.errors?.['required']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              Vui l\u00F2ng nh\u1EADp th\u00F4ng tin\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator']) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.c-selected::placeholder{color:#000;opacity:1}:host ::ng-deep .mat-mdc-form-field input.c-selected:-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.c-selected::-ms-input-placeholder{color:#000}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected:-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled.c-selected::-ms-input-placeholder{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field:hover .icon-copy{opacity:1}:host ::ng-deep .mat-mdc-form-field .icon-copy{cursor:pointer;width:.9em;height:.9em;fill:#00000080;transition:opacity .2s linear;opacity:0}::ng-deep .sd-autocomplete-panel .mat-mdc-option{min-height:36px!important;height:36px!important;padding-left:12px!important;padding-right:12px!important}::ng-deep .sd-autocomplete-panel .mdc-list-item__primary-text{font-size:14px!important;line-height:normal}::ng-deep .sd-autocomplete-panel .mat-pseudo-checkbox{transform:scale(.75);margin-right:8px!important}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}.sd__option--add{position:sticky;bottom:0;background-color:#fff;z-index:10;color:#000000de;cursor:pointer!important}.c-loading-icon{position:absolute;right:5px;top:5px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [SD_FORM_CONFIGURATION]

package/fesm2022/sd-angular-core-forms-autocomplete.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sd-angular-core-forms-autocomplete.mjs","sources":["../../../projects/sd-angular/forms/autocomplete/src/autocomplete.component.ts","../../../projects/sd-angular/forms/autocomplete/src/autocomplete.component.html","../../../projects/sd-angular/forms/autocomplete/sd-angular-core-forms-autocomplete.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/component-class-suffix /\r\n\r\n/ eslint-disable @typescript-eslint/no-explicit-any /\r\n/ eslint-disable @angular-eslint/no-input-rename /\r\nimport {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n ChangeDetectorRef,\r\n Component,\r\n ContentChild,\r\n ElementRef,\r\n EventEmitter,\r\n Inject,\r\n Input,\r\n OnDestroy,\r\n OnInit,\r\n Optional,\r\n Output,\r\n ViewChild,\r\n} from '@angular/core';\r\nimport { catchError, debounceTime, finalize, map, startWith, switchMap } from 'rxjs/operators';\r\n\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n AsyncValidatorFn,\r\n FormControl,\r\n FormGroup,\r\n FormGroupDirective,\r\n FormsModule,\r\n NgForm,\r\n ReactiveFormsModule,\r\n ValidatorFn,\r\n Validators,\r\n} from '@angular/forms';\r\nimport { MatAutocompleteModule, MatAutocompleteTrigger } from '@angular/material/autocomplete';\r\nimport { ErrorStateMatcher } from '@angular/material/core';\r\nimport { MatFormFieldAppearance, MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdItemDefDefDirective, SdLabelDefDirective, SdViewDefDirective } from '@sd-angular/core/forms/directives';\r\nimport {\r\n HandleSdCustomValidator,\r\n ISdFormConfiguration,\r\n SD_FORM_CONFIGURATION,\r\n SdCustomValidator,\r\n SdFormControl,\r\n SdSearch,\r\n SdSelectionData,\r\n} from '@sd-angular/core/forms/models';\r\nimport { ArrayUtilities, SdUtilities } from '@sd-angular/core/utilities/extensions';\r\nimport { SdSize } from '@sd-angular/core/utilities/models';\r\n// import hash from 'object-hash';\r\nimport { BehaviorSubject, combineLatest, defer, from, Observable, of, Subscription } from 'rxjs';\r\nimport as uuid from 'uuid';\r\nimport { SdLabel } from '@sd-angular/core/forms/label';\r\nimport { SdEmptyPipe } from '@sd-angular/core/pipes';\r\n\r\nclass SdAutocompleteErrotStateMatcher implements ErrorStateMatcher {\r\n constructor(private formControl: FormControl) {}\r\n isErrorState(control: FormControl \| null, form: FormGroupDirective \| NgForm \| null): boolean {\r\n const isSubmitted = form && form.submitted;\r\n return !!(this.formControl?.invalid && (this.formControl?.dirty \|\| this.formControl?.touched \|\| isSubmitted));\r\n }\r\n}\r\n\r\n@Component({\r\n selector: 'sd-autocomplete',\r\n templateUrl: './autocomplete.component.html',\r\n styleUrls: ['./autocomplete.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [\r\n CommonModule,\r\n FormsModule,\r\n ReactiveFormsModule,\r\n MatInputModule,\r\n MatTooltipModule,\r\n MatFormFieldModule,\r\n MatAutocompleteModule,\r\n MatIconModule,\r\n MatProgressSpinnerModule,\r\n SdLabel,\r\n SdEmptyPipe\r\n ],\r\n})\r\nexport class SdAutocomplete<T = any> implements OnInit, OnDestroy, AfterViewInit {\r\n id = `I${uuid.v4()}`;\r\n autoId?: string;\r\n @Input('autoId') set _autoId(val: string \| undefined \| null) {\r\n if (!val) {\r\n return;\r\n }\r\n this.autoId = `forms-autocomplete-${val}`;\r\n }\r\n // @Input() set key(value: any) {\r\n // this.#cache = {};\r\n // this.#item = {};\r\n // }\r\n @ViewChild(MatAutocompleteTrigger, { read: MatAutocompleteTrigger })\r\n autocompleteTrigger?: MatAutocompleteTrigger;\r\n\r\n #model?: string \| number;\r\n #delay = 0; // Sau khoảng thời gian delay nếu không có thay đổi thì thì mới bắt đầu thực hiện gọi hàm\r\n #name = uuid.v4();\r\n @Input() set name(val: string \| undefined) {\r\n if (val) {\r\n this.#name = val;\r\n }\r\n }\r\n @Input() appearance?: MatFormFieldAppearance = 'outline';\r\n loading = false;\r\n inputControl = new SdFormControl();\r\n formControl = new SdFormControl();\r\n matcher = new SdAutocompleteErrotStateMatcher(this.formControl);\r\n @Input() size: SdSize = 'md';\r\n #form?: FormGroup;\r\n @Input() set form(val: NgForm \| FormGroup \| undefined \| null) {\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 label?: string;\r\n @Input('label') set _label(val: string \| undefined) {\r\n this.label = val;\r\n }\r\n\r\n helperText?: string;\r\n @Input('helperText') set _helperText(val: string \| undefined) {\r\n this.helperText = val;\r\n }\r\n\r\n @Input() valueField?: string;\r\n @Input() displayField?: string;\r\n @Input() disabledField = '';\r\n @Input() placeholder?: string;\r\n\r\n #itemsChanges = new BehaviorSubject<T[] \| SdSearch<T>>([]);\r\n @Input() set items(items: undefined \| null \| T[] \| SdSearch<T>) {\r\n this.#delay = 0;\r\n // Mỗi lần items được set lại phải clear cache\r\n this.#cache = {};\r\n if (!items) {\r\n this.#itemsChanges.next([]);\r\n } else if (Array.isArray(items)) {\r\n this.#itemsChanges.next(items.filter(e => e !== null && e !== undefined));\r\n } else {\r\n this.#itemsChanges.next(items);\r\n this.#delay = 500;\r\n }\r\n this.formControl.updateValueAndValidity();\r\n }\r\n\r\n @Input() limit = 100;\r\n filteredItems?: Observable<any[]>;\r\n\r\n // Nếu items là 1 function gọi về server và có những tham số bên ngoài tác động đến kết quả trả về thì truyền thêm\r\n // Ví dụ: [cacheCheckSum]=\"{a: aValue, b: bValue}\"\r\n @Input() cacheChecksum: any;\r\n\r\n controlPlaceHolder?: Observable<string>;\r\n @Input() set model(value: undefined \| number \| string) {\r\n if (this.#model !== value) {\r\n this.#model = value;\r\n this.formControl.setValue(value);\r\n }\r\n }\r\n addable = false;\r\n @Input('addable') set _addable(addable: boolean \| '' \| undefined \| null) {\r\n this.addable = addable === '' \|\| !!addable;\r\n }\r\n\r\n @ContentChild(SdItemDefDefDirective) itemDef?: SdItemDefDefDirective;\r\n @ContentChild(SdLabelDefDirective) sdLabelDef?: SdLabelDefDirective;\r\n\r\n @Output() modelChange = new EventEmitter();\r\n @Output() sdChange = new EventEmitter<string \| number \| null>();\r\n @Output() sdSelection = new EventEmitter<SdSelectionData>();\r\n @Output() sdAdd = new EventEmitter();\r\n // Optional\r\n @Input() set disabled(val: boolean \| '' \| undefined \| null) {\r\n val = val === '' \|\| val \|\| !!val;\r\n if (val) {\r\n this.inputControl.disable();\r\n this.formControl.disable();\r\n } else {\r\n this.inputControl.enable();\r\n this.formControl.enable();\r\n }\r\n }\r\n\r\n viewed = false;\r\n @Input('viewed') set _viewed(val: boolean \| '' \| undefined \| null) {\r\n this.viewed = val === '' \|\| !!val;\r\n }\r\n\r\n @Input() hyperlink?: string \| null;\r\n\r\n required = false;\r\n @Input('required') set _required(val: boolean \| '' \| undefined \| null) {\r\n this.required = val === '' \|\| !!val;\r\n this.#updateValidator();\r\n }\r\n #validator?: SdCustomValidator;\r\n @Input('validator') set _validator(value: SdCustomValidator \| undefined) {\r\n this.#validator = value;\r\n this.#updateValidator();\r\n }\r\n inlineError?: string;\r\n @Input('inlineError') set _inlineError(val: string) {\r\n this.inlineError = val;\r\n this.#updateValidator();\r\n }\r\n hideInlineError = false;\r\n @Input('hideInlineError') set _hideInlineError(val: boolean \| '') {\r\n this.hideInlineError = val === '' \|\| val;\r\n val = val === '' \|\| val;\r\n }\r\n #subscription = new Subscription();\r\n @ViewChild('input') input?: ElementRef;\r\n @ContentChild(SdViewDefDirective) sdViewDef?: SdViewDefDirective;\r\n isFocused = false;\r\n selected?: Observable<T>;\r\n display?: Observable<string>;\r\n #cache: Record<string, T[]> = {};\r\n #item: Record<string, T> = {};\r\n isTyping = false;\r\n\r\n constructor(\r\n private ref: ChangeDetectorRef,\r\n @Inject(SD_FORM_CONFIGURATION)\r\n @Optional()\r\n private formConfig: ISdFormConfiguration\r\n ) {}\r\n\r\n ngOnInit() {\r\n this.appearance = this.appearance \|\| this.formConfig?.appearance;\r\n this.#subscription.add(\r\n this.inputControl.touchChanges.subscribe(() => {\r\n this.formControl.markAsTouched();\r\n this.ref.markForCheck();\r\n })\r\n );\r\n this.#subscription.add(\r\n this.formControl.sdChanges.subscribe(() => {\r\n this.ref.markForCheck();\r\n })\r\n );\r\n this.#subscription.add(\r\n this.inputControl.sdChanges.subscribe(() => {\r\n this.ref.markForCheck();\r\n })\r\n );\r\n this.#subscription.add(\r\n this.inputControl.valueChanges.subscribe(() => {\r\n this.isTyping = true;\r\n })\r\n );\r\n this.filteredItems = combineLatest([\r\n this.#itemsChanges.asObservable(),\r\n this.inputControl.valueChanges.pipe(debounceTime(this.#delay)),\r\n ]).pipe(\r\n switchMap(([items, searchText]) => {\r\n this.isTyping = false;\r\n searchText = searchText \|\| '';\r\n if (typeof items !== 'function') {\r\n return of(ArrayUtilities.paging(ArrayUtilities.search(items, searchText, [this.valueField, this.displayField]), this.limit));\r\n }\r\n const key = SdUtilities.hash({\r\n checksum: this.cacheChecksum \|\| null,\r\n searchText,\r\n });\r\n if (this.#cache[key] !== undefined) {\r\n this.isTyping = false;\r\n return of(this.#cache[key]);\r\n }\r\n let obs: Observable<T[]>;\r\n const func = items({ type: 'SEARCH', searchText });\r\n if (func instanceof Promise) {\r\n obs = defer(() => from(func));\r\n } else {\r\n obs = func;\r\n }\r\n this.loading = true;\r\n this.ref.markForCheck();\r\n return obs.pipe(\r\n map(data => {\r\n this.#cache[key] = data \|\| [];\r\n Object.assign(this.#item, ArrayUtilities.toObject(this.valueField!, this.#cache[key]));\r\n return this.#cache[key];\r\n }),\r\n catchError(() => of([])),\r\n finalize(() => {\r\n this.loading = false;\r\n this.ref.markForCheck();\r\n })\r\n );\r\n })\r\n );\r\n this.selected = combineLatest([\r\n this.#itemsChanges.asObservable(),\r\n this.formControl.valueChanges.pipe(startWith(this.formControl.value)),\r\n ]).pipe(\r\n switchMap(([items]) => {\r\n // Vì một số lý do chưa xác định mà khi sử dụng sdViewDef thì khi chuyển sang dạng view sẽ trigger val = null\r\n // Nhưng formControl.value vẫn có giá trị đúng nên thực hiện gán val = this.formControl.value;\r\n const val = this.formControl.value;\r\n if (!this.valueField) {\r\n return of(val);\r\n }\r\n if (val \|\| val === 0) {\r\n if (typeof items === 'function') {\r\n if (this.#item[val]) {\r\n return of(this.#item[val]);\r\n }\r\n let obs: Observable<T[]>;\r\n const func = items({ type: 'VALUE', value: val });\r\n if (func instanceof Promise) {\r\n obs = defer(() => from(func));\r\n } else {\r\n obs = func;\r\n }\r\n return obs.pipe(\r\n map(data => {\r\n Object.assign(this.#item, ArrayUtilities.toObject(this.valueField!, data));\r\n return (\r\n this.#item[val] \|\| {\r\n [this.valueField!]: val,\r\n [this.displayField!]: val,\r\n }\r\n );\r\n }),\r\n catchError(() => {\r\n return of({\r\n [this.valueField!]: val,\r\n [this.displayField!]: val,\r\n });\r\n }),\r\n finalize(() => {\r\n this.loading = false;\r\n this.ref.markForCheck();\r\n })\r\n );\r\n }\r\n return of(items.find((e: any) => e[this.valueField!] === val));\r\n }\r\n return of('');\r\n })\r\n );\r\n this.controlPlaceHolder = this.selected.pipe(\r\n map((item: T) => {\r\n return (item as any)?.[this.displayField!] ?? item ?? this.placeholder ?? (this.appearance ? this.label : '');\r\n })\r\n );\r\n this.display = this.selected.pipe(\r\n map((item: T) => {\r\n if (this.disabledField && typeof item === 'object' && !!item) {\r\n return (item as any)?.[this.disabledField] ?? '';\r\n }\r\n if (typeof item === 'string' \|\| typeof item === 'number') {\r\n return item;\r\n }\r\n return '';\r\n })\r\n );\r\n }\r\n\r\n ngAfterViewInit() {\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 onSelect = (item: T) => {\r\n if (item) {\r\n if (typeof item === 'string' \|\| typeof item === 'number') {\r\n if (this.formControl.value !== item) {\r\n this.formControl.setValue(item);\r\n this.modelChange.emit(item);\r\n this.sdChange.emit(item);\r\n this.sdSelection.emit({\r\n values: [item],\r\n selectedItems: [item],\r\n value: item,\r\n selectedItem: item,\r\n });\r\n }\r\n } else if (this.valueField && this.displayField) {\r\n const val = (item as any)?.[this.valueField!] \|\| null;\r\n if (this.formControl.value !== val) {\r\n this.formControl.setValue(val);\r\n this.modelChange.emit(val);\r\n this.sdChange.emit(val);\r\n this.sdSelection.emit({\r\n values: [val],\r\n selectedItems: [item],\r\n value: val,\r\n selectedItem: item,\r\n });\r\n }\r\n }\r\n this.inputControl.setValue('', {\r\n emitEvent: false,\r\n });\r\n }\r\n };\r\n\r\n onFocus = () => {\r\n this.isFocused = true;\r\n this.inputControl.setValue('');\r\n // this.inputControl.updateValueAndValidity();\r\n };\r\n\r\n onBlur = () => {\r\n this.isFocused = false;\r\n this.inputControl.setValue('', {\r\n emitEvent: false,\r\n });\r\n };\r\n\r\n onClick = () => {\r\n if (this.sdViewDef?.templateRef) {\r\n if (!this.formControl.disabled && !this.isFocused) {\r\n this.focus();\r\n }\r\n }\r\n };\r\n\r\n blur = () => {\r\n this.input?.nativeElement?.blur();\r\n };\r\n\r\n focus = () => {\r\n this.isFocused = true;\r\n setTimeout(() => {\r\n this.autocompleteTrigger?.openPanel();\r\n this.input?.nativeElement?.focus();\r\n }, 100);\r\n };\r\n\r\n clear = ($event?: any) => {\r\n $event?.stopPropagation();\r\n this.inputControl?.setValue('');\r\n if (this.#model) {\r\n this.formControl.setValue(null);\r\n this.modelChange.emit(null);\r\n this.sdChange.emit(null);\r\n this.sdSelection.emit({\r\n values: [null],\r\n selectedItems: [],\r\n value: null,\r\n selectedItem: null,\r\n });\r\n }\r\n };\r\n\r\n onAdd = ($event: Event) => {\r\n $event.stopPropagation();\r\n $event?.preventDefault();\r\n this.sdAdd.emit();\r\n };\r\n\r\n reValidate = () => {\r\n this.inputControl.updateValueAndValidity({ emitEvent: true });\r\n };\r\n\r\n #updateValidator = () => {\r\n this.formControl.clearValidators();\r\n this.formControl.clearAsyncValidators();\r\n const validators: ValidatorFn[] = [];\r\n const asyncValidators: AsyncValidatorFn[] = [];\r\n // const asyncValidators: AsyncValidatorFn[] = [];\r\n if (this.required) {\r\n validators.push(Validators.required);\r\n }\r\n if (this.#validator) {\r\n asyncValidators.push(HandleSdCustomValidator(this.#validator));\r\n }\r\n if (this.inlineError) {\r\n validators.push(this.customInlineErrorValidator());\r\n }\r\n this.formControl.setValidators(validators);\r\n this.formControl.setAsyncValidators(asyncValidators);\r\n this.formControl.updateValueAndValidity();\r\n };\r\n\r\n // Hàm tạo Validators tùy chỉnh cho inlineError\r\n customInlineErrorValidator(): ValidatorFn {\r\n return (): Record<string, any> \| null => {\r\n return { inlineError: true };\r\n };\r\n }\r\n}\r\n","@if (viewed) {\r\n @if (sdLabelDef?.templateRef) {\r\n <ng-container ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n } @else if (label) {\r\n <div class=\"T14R text-black400\">{{ label }}</div>\r\n }\r\n @if (hyperlink) {\r\n <!-- Nếu có hyperlink thì dùng thẻ a -->\r\n <a [href]=\"hyperlink\">{{ display \| async }}</a>\r\n } @else {\r\n <!-- Ngoài ra dùng thẻ mặc định -->\r\n <div class=\"T16M\">{{ display \| async \| sdEmpty }}</div>\r\n }\r\n} @else {\r\n @if (!appearance && sdLabelDef?.templateRef) {\r\n <ng-container ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n }\r\n @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n }\r\n <div\r\n class=\"d-flex align-items-center\"\r\n [class.sd-view]=\"sdViewDef?.templateRef\"\r\n [class.c-focused]=\"isFocused\"\r\n [class.c-disabled]=\"formControl.disabled\"\r\n (click)=\"onClick()\"\r\n aria-hidden=\"true\">\r\n @if (sdViewDef?.templateRef && !autocompleteTrigger?.panelOpen && !isFocused) {\r\n <ng-container\r\n ngTemplateOutlet=\"\r\n sdViewDef!.templateRef;\r\n context: {\r\n value: formControl.value,\r\n selectedItem: selected \| async,\r\n }\r\n \">\r\n </ng-container>\r\n } @else {\r\n <mat-form-field\r\n [class.sd-md]=\"size === 'md'\"\r\n [class.sd-sm]=\"size === 'sm'\"\r\n [class.hide-inline-error]=\"hideInlineError\"\r\n [floatLabel]=\"formControl.value ? 'always' : 'auto'\"\r\n [appearance]=\"appearance \|\| 'outline'\">\r\n @if (appearance && label) {\r\n <mat-label style=\"display: inline-block\">\r\n <div style=\"display: flex; align-items: center; gap: 4px\">\r\n <span>{{ label }}</span>\r\n @if (helperText) {\r\n <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n }\r\n </div>\r\n </mat-label>\r\n }\r\n <input\r\n [id]=\"id\"\r\n [formControl]=\"inputControl\"\r\n [placeholder]=\"(controlPlaceHolder \| async) \|\| ''\"\r\n [class.c-selected]=\"formControl.value\"\r\n [matAutocomplete]=\"auto\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n matInput\r\n [autocomplete]=\"id\"\r\n autocorrect=\"off\"\r\n [errorStateMatcher]=\"matcher\"\r\n [required]=\"required\"\r\n #input\r\n #autocompleteTrigger\r\n [attr.data-autoId]=\"autoId\"\r\n aria-hidden=\"true\" />\r\n @if (!loading && formControl.value && !inputControl.disabled) {\r\n <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel</mat-icon>\r\n } @else if (loading) {\r\n <mat-spinner [diameter]=\"20\" matSuffix></mat-spinner>\r\n } @else {\r\n <mat-icon class=\"pointer sd-suffix-icon\" matSuffix>search</mat-icon>\r\n }\r\n <!-- <i [class.d-none]=\"!loading\" class=\"fa fa-spinner fa-pulse c-loading-icon\"></i> -->\r\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelect($event.option.value)\">\r\n @let items = filteredItems \| async;\r\n @if (items?.length) {\r\n <mat-option\r\n ngFor=\"let item of items\"\r\n [value]=\"item\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"displayField ? item[displayField] : item\"\r\n [disabled]=\"item[disabledField]\">\r\n <ng-container ngIf=\"itemDef?.templateRef\">\r\n <ng-container ngTemplateOutlet=\"itemDef?.templateRef ?? null; context: { item: item }\"> </ng-container>\r\n </ng-container>\r\n <ng-container ngIf=\"!itemDef?.templateRef\">\r\n {{ displayField ? item[displayField] : item }}\r\n </ng-container>\r\n </mat-option>\r\n } @else if (!items?.length && inputControl.value && !isTyping && !loading) {}\r\n @if (addable && sdAdd.observers.length) {\r\n <mat-option class=\"sd__option--add\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n <div (click)=\"onAdd($event)\">\r\n <mat-icon class=\"mr-1\">add</mat-icon>\r\n {{ 'New item' }}\r\n </div>\r\n </mat-option>\r\n }\r\n </mat-autocomplete>\r\n @if (formControl.errors?.['required']) {\r\n <mat-error>\r\n @if (!hideInlineError) {\r\n Vui lòng nhập thông tin\r\n }\r\n </mat-error>\r\n }\r\n @if (formControl.errors?.['customValidator']) {\r\n <mat-error>\r\n @if (!hideInlineError) {\r\n {{ formControl.errors?.['customValidator'] }}\r\n }\r\n </mat-error>\r\n }\r\n </mat-form-field>\r\n }\r\n </div>\r\n}\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"sd-angular-core-forms-autocomplete.mjs","sources":["../../../projects/sd-angular/forms/autocomplete/src/autocomplete.component.ts","../../../projects/sd-angular/forms/autocomplete/src/autocomplete.component.html","../../../projects/sd-angular/forms/autocomplete/sd-angular-core-forms-autocomplete.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/component-class-suffix /\r\n\r\n/ eslint-disable @typescript-eslint/no-explicit-any /\r\n/ eslint-disable @angular-eslint/no-input-rename /\r\nimport {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n ChangeDetectorRef,\r\n Component,\r\n ContentChild,\r\n ElementRef,\r\n EventEmitter,\r\n Inject,\r\n Input,\r\n OnDestroy,\r\n OnInit,\r\n Optional,\r\n Output,\r\n ViewChild,\r\n} from '@angular/core';\r\nimport { catchError, debounceTime, finalize, map, startWith, switchMap } from 'rxjs/operators';\r\n\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n AsyncValidatorFn,\r\n FormControl,\r\n FormGroup,\r\n FormGroupDirective,\r\n FormsModule,\r\n NgForm,\r\n ReactiveFormsModule,\r\n ValidatorFn,\r\n Validators,\r\n} from '@angular/forms';\r\nimport { MatAutocompleteModule, MatAutocompleteTrigger } from '@angular/material/autocomplete';\r\nimport { ErrorStateMatcher } from '@angular/material/core';\r\nimport { MatFormFieldAppearance, MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdItemDefDefDirective, SdLabelDefDirective, SdViewDefDirective } from '@sd-angular/core/forms/directives';\r\nimport {\r\n HandleSdCustomValidator,\r\n ISdFormConfiguration,\r\n SD_FORM_CONFIGURATION,\r\n SdCustomValidator,\r\n SdFormControl,\r\n SdSearch,\r\n SdSelectionData,\r\n} from '@sd-angular/core/forms/models';\r\nimport { ArrayUtilities, SdUtilities } from '@sd-angular/core/utilities/extensions';\r\nimport { SdSize } from '@sd-angular/core/utilities/models';\r\n// import hash from 'object-hash';\r\nimport { BehaviorSubject, combineLatest, defer, from, Observable, of, Subscription } from 'rxjs';\r\nimport as uuid from 'uuid';\r\nimport { SdLabel } from '@sd-angular/core/forms/label';\r\nimport { SdEmptyPipe } from '@sd-angular/core/pipes';\r\n\r\nclass SdAutocompleteErrotStateMatcher implements ErrorStateMatcher {\r\n constructor(private formControl: FormControl) {}\r\n isErrorState(control: FormControl \| null, form: FormGroupDirective \| NgForm \| null): boolean {\r\n const isSubmitted = form && form.submitted;\r\n return !!(this.formControl?.invalid && (this.formControl?.dirty \|\| this.formControl?.touched \|\| isSubmitted));\r\n }\r\n}\r\n\r\n@Component({\r\n selector: 'sd-autocomplete',\r\n templateUrl: './autocomplete.component.html',\r\n styleUrls: ['./autocomplete.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [\r\n CommonModule,\r\n FormsModule,\r\n ReactiveFormsModule,\r\n MatInputModule,\r\n MatTooltipModule,\r\n MatFormFieldModule,\r\n MatAutocompleteModule,\r\n MatIconModule,\r\n MatProgressSpinnerModule,\r\n SdLabel,\r\n SdEmptyPipe\r\n ],\r\n})\r\nexport class SdAutocomplete<T = any> implements OnInit, OnDestroy, AfterViewInit {\r\n id = `I${uuid.v4()}`;\r\n autoId?: string;\r\n @Input('autoId') set _autoId(val: string \| undefined \| null) {\r\n if (!val) {\r\n return;\r\n }\r\n this.autoId = `forms-autocomplete-${val}`;\r\n }\r\n // @Input() set key(value: any) {\r\n // this.#cache = {};\r\n // this.#item = {};\r\n // }\r\n @ViewChild(MatAutocompleteTrigger, { read: MatAutocompleteTrigger })\r\n autocompleteTrigger?: MatAutocompleteTrigger;\r\n\r\n #model?: string \| number;\r\n #delay = 0; // Sau khoảng thời gian delay nếu không có thay đổi thì thì mới bắt đầu thực hiện gọi hàm\r\n #name = uuid.v4();\r\n @Input() set name(val: string \| undefined) {\r\n if (val) {\r\n this.#name = val;\r\n }\r\n }\r\n @Input() appearance?: MatFormFieldAppearance = 'outline';\r\n loading = false;\r\n inputControl = new SdFormControl();\r\n formControl = new SdFormControl();\r\n matcher = new SdAutocompleteErrotStateMatcher(this.formControl);\r\n @Input() size: SdSize = 'md';\r\n #form?: FormGroup;\r\n @Input() set form(val: NgForm \| FormGroup \| undefined \| null) {\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 label?: string;\r\n @Input('label') set _label(val: string \| undefined) {\r\n this.label = val;\r\n }\r\n\r\n helperText?: string;\r\n @Input('helperText') set _helperText(val: string \| undefined) {\r\n this.helperText = val;\r\n }\r\n\r\n @Input() valueField?: string;\r\n @Input() displayField?: string;\r\n @Input() disabledField = '';\r\n @Input() placeholder?: string;\r\n\r\n #itemsChanges = new BehaviorSubject<T[] \| SdSearch<T>>([]);\r\n @Input() set items(items: undefined \| null \| T[] \| SdSearch<T>) {\r\n this.#delay = 0;\r\n // Mỗi lần items được set lại phải clear cache\r\n this.#cache = {};\r\n if (!items) {\r\n this.#itemsChanges.next([]);\r\n } else if (Array.isArray(items)) {\r\n this.#itemsChanges.next(items.filter(e => e !== null && e !== undefined));\r\n } else {\r\n this.#itemsChanges.next(items);\r\n this.#delay = 500;\r\n }\r\n this.formControl.updateValueAndValidity();\r\n }\r\n\r\n @Input() limit = 100;\r\n filteredItems?: Observable<any[]>;\r\n\r\n // Nếu items là 1 function gọi về server và có những tham số bên ngoài tác động đến kết quả trả về thì truyền thêm\r\n // Ví dụ: [cacheCheckSum]=\"{a: aValue, b: bValue}\"\r\n @Input() cacheChecksum: any;\r\n\r\n controlPlaceHolder?: Observable<string>;\r\n @Input() set model(value: undefined \| number \| string) {\r\n if (this.#model !== value) {\r\n this.#model = value;\r\n this.formControl.setValue(value);\r\n }\r\n }\r\n addable = false;\r\n @Input('addable') set _addable(addable: boolean \| '' \| undefined \| null) {\r\n this.addable = addable === '' \|\| !!addable;\r\n }\r\n\r\n @ContentChild(SdItemDefDefDirective) itemDef?: SdItemDefDefDirective;\r\n @ContentChild(SdLabelDefDirective) sdLabelDef?: SdLabelDefDirective;\r\n\r\n @Output() modelChange = new EventEmitter();\r\n @Output() sdChange = new EventEmitter<string \| number \| null>();\r\n @Output() sdSelection = new EventEmitter<SdSelectionData>();\r\n @Output() sdAdd = new EventEmitter();\r\n // Optional\r\n @Input() set disabled(val: boolean \| '' \| undefined \| null) {\r\n val = val === '' \|\| val \|\| !!val;\r\n if (val) {\r\n this.inputControl.disable();\r\n this.formControl.disable();\r\n } else {\r\n this.inputControl.enable();\r\n this.formControl.enable();\r\n }\r\n }\r\n\r\n viewed = false;\r\n @Input('viewed') set _viewed(val: boolean \| '' \| undefined \| null) {\r\n this.viewed = val === '' \|\| !!val;\r\n }\r\n\r\n @Input() hyperlink?: string \| null;\r\n\r\n required = false;\r\n @Input('required') set _required(val: boolean \| '' \| undefined \| null) {\r\n this.required = val === '' \|\| !!val;\r\n this.#updateValidator();\r\n }\r\n #validator?: SdCustomValidator;\r\n @Input('validator') set _validator(value: SdCustomValidator \| undefined) {\r\n this.#validator = value;\r\n this.#updateValidator();\r\n }\r\n inlineError?: string;\r\n @Input('inlineError') set _inlineError(val: string) {\r\n this.inlineError = val;\r\n this.#updateValidator();\r\n }\r\n hideInlineError = false;\r\n @Input('hideInlineError') set _hideInlineError(val: boolean \| '') {\r\n this.hideInlineError = val === '' \|\| val;\r\n val = val === '' \|\| val;\r\n }\r\n #subscription = new Subscription();\r\n @ViewChild('input') input?: ElementRef;\r\n @ContentChild(SdViewDefDirective) sdViewDef?: SdViewDefDirective;\r\n isFocused = false;\r\n selected?: Observable<T>;\r\n display?: Observable<string>;\r\n #cache: Record<string, T[]> = {};\r\n #item: Record<string, T> = {};\r\n isTyping = false;\r\n\r\n constructor(\r\n private ref: ChangeDetectorRef,\r\n @Inject(SD_FORM_CONFIGURATION)\r\n @Optional()\r\n private formConfig: ISdFormConfiguration\r\n ) {}\r\n\r\n ngOnInit() {\r\n this.appearance = this.appearance \|\| this.formConfig?.appearance;\r\n this.#subscription.add(\r\n this.inputControl.touchChanges.subscribe(() => {\r\n this.formControl.markAsTouched();\r\n this.ref.markForCheck();\r\n })\r\n );\r\n this.#subscription.add(\r\n this.formControl.sdChanges.subscribe(() => {\r\n this.ref.markForCheck();\r\n })\r\n );\r\n this.#subscription.add(\r\n this.inputControl.sdChanges.subscribe(() => {\r\n this.ref.markForCheck();\r\n })\r\n );\r\n this.#subscription.add(\r\n this.inputControl.valueChanges.subscribe(() => {\r\n this.isTyping = true;\r\n })\r\n );\r\n this.filteredItems = combineLatest([\r\n this.#itemsChanges.asObservable(),\r\n this.inputControl.valueChanges.pipe(debounceTime(this.#delay)),\r\n ]).pipe(\r\n switchMap(([items, searchText]) => {\r\n this.isTyping = false;\r\n searchText = searchText \|\| '';\r\n if (typeof items !== 'function') {\r\n return of(ArrayUtilities.paging(ArrayUtilities.search(items, searchText, [this.valueField, this.displayField]), this.limit));\r\n }\r\n const key = SdUtilities.hash({\r\n checksum: this.cacheChecksum \|\| null,\r\n searchText,\r\n });\r\n if (this.#cache[key] !== undefined) {\r\n this.isTyping = false;\r\n return of(this.#cache[key]);\r\n }\r\n let obs: Observable<T[]>;\r\n const func = items({ type: 'SEARCH', searchText });\r\n if (func instanceof Promise) {\r\n obs = defer(() => from(func));\r\n } else {\r\n obs = func;\r\n }\r\n this.loading = true;\r\n this.ref.markForCheck();\r\n return obs.pipe(\r\n map(data => {\r\n this.#cache[key] = data \|\| [];\r\n Object.assign(this.#item, ArrayUtilities.toObject(this.valueField!, this.#cache[key]));\r\n return this.#cache[key];\r\n }),\r\n catchError(() => of([])),\r\n finalize(() => {\r\n this.loading = false;\r\n this.ref.markForCheck();\r\n })\r\n );\r\n })\r\n );\r\n this.selected = combineLatest([\r\n this.#itemsChanges.asObservable(),\r\n this.formControl.valueChanges.pipe(startWith(this.formControl.value)),\r\n ]).pipe(\r\n switchMap(([items]) => {\r\n // Vì một số lý do chưa xác định mà khi sử dụng sdViewDef thì khi chuyển sang dạng view sẽ trigger val = null\r\n // Nhưng formControl.value vẫn có giá trị đúng nên thực hiện gán val = this.formControl.value;\r\n const val = this.formControl.value;\r\n if (!this.valueField) {\r\n return of(val);\r\n }\r\n if (val \|\| val === 0) {\r\n if (typeof items === 'function') {\r\n if (this.#item[val]) {\r\n return of(this.#item[val]);\r\n }\r\n let obs: Observable<T[]>;\r\n const func = items({ type: 'VALUE', value: val });\r\n if (func instanceof Promise) {\r\n obs = defer(() => from(func));\r\n } else {\r\n obs = func;\r\n }\r\n return obs.pipe(\r\n map(data => {\r\n Object.assign(this.#item, ArrayUtilities.toObject(this.valueField!, data));\r\n return (\r\n this.#item[val] \|\| {\r\n [this.valueField!]: val,\r\n [this.displayField!]: val,\r\n }\r\n );\r\n }),\r\n catchError(() => {\r\n return of({\r\n [this.valueField!]: val,\r\n [this.displayField!]: val,\r\n });\r\n }),\r\n finalize(() => {\r\n this.loading = false;\r\n this.ref.markForCheck();\r\n })\r\n );\r\n }\r\n return of(items.find((e: any) => e[this.valueField!] === val));\r\n }\r\n return of('');\r\n })\r\n );\r\n this.controlPlaceHolder = this.selected.pipe(\r\n map((item: T) => {\r\n return (item as any)?.[this.displayField!] ?? item ?? this.placeholder ?? (this.appearance ? this.label : '');\r\n })\r\n );\r\n this.display = this.selected.pipe(\r\n map((item: T) => {\r\n if (this.disabledField && typeof item === 'object' && !!item) {\r\n return (item as any)?.[this.disabledField] ?? '';\r\n }\r\n if (typeof item === 'string' \|\| typeof item === 'number') {\r\n return item;\r\n }\r\n return '';\r\n })\r\n );\r\n }\r\n\r\n ngAfterViewInit() {\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 onSelect = (item: T) => {\r\n if (item) {\r\n if (typeof item === 'string' \|\| typeof item === 'number') {\r\n if (this.formControl.value !== item) {\r\n this.formControl.setValue(item);\r\n this.modelChange.emit(item);\r\n this.sdChange.emit(item);\r\n this.sdSelection.emit({\r\n values: [item],\r\n selectedItems: [item],\r\n value: item,\r\n selectedItem: item,\r\n });\r\n }\r\n } else if (this.valueField && this.displayField) {\r\n const val = (item as any)?.[this.valueField!] \|\| null;\r\n if (this.formControl.value !== val) {\r\n this.formControl.setValue(val);\r\n this.modelChange.emit(val);\r\n this.sdChange.emit(val);\r\n this.sdSelection.emit({\r\n values: [val],\r\n selectedItems: [item],\r\n value: val,\r\n selectedItem: item,\r\n });\r\n }\r\n }\r\n this.inputControl.setValue('', {\r\n emitEvent: false,\r\n });\r\n }\r\n };\r\n\r\n onFocus = () => {\r\n this.isFocused = true;\r\n this.inputControl.setValue('');\r\n // this.inputControl.updateValueAndValidity();\r\n };\r\n\r\n onBlur = () => {\r\n this.isFocused = false;\r\n this.inputControl.setValue('', {\r\n emitEvent: false,\r\n });\r\n };\r\n\r\n onClick = () => {\r\n if (this.sdViewDef?.templateRef) {\r\n if (!this.formControl.disabled && !this.isFocused) {\r\n this.focus();\r\n }\r\n }\r\n };\r\n\r\n blur = () => {\r\n this.input?.nativeElement?.blur();\r\n };\r\n\r\n focus = () => {\r\n this.isFocused = true;\r\n setTimeout(() => {\r\n this.autocompleteTrigger?.openPanel();\r\n this.input?.nativeElement?.focus();\r\n }, 100);\r\n };\r\n\r\n clear = ($event?: any) => {\r\n $event?.stopPropagation();\r\n this.inputControl?.setValue('');\r\n if (this.#model) {\r\n this.formControl.setValue(null);\r\n this.modelChange.emit(null);\r\n this.sdChange.emit(null);\r\n this.sdSelection.emit({\r\n values: [null],\r\n selectedItems: [],\r\n value: null,\r\n selectedItem: null,\r\n });\r\n }\r\n };\r\n\r\n onAdd = ($event: Event) => {\r\n $event.stopPropagation();\r\n $event?.preventDefault();\r\n this.sdAdd.emit();\r\n };\r\n\r\n reValidate = () => {\r\n this.inputControl.updateValueAndValidity({ emitEvent: true });\r\n };\r\n\r\n #updateValidator = () => {\r\n this.formControl.clearValidators();\r\n this.formControl.clearAsyncValidators();\r\n const validators: ValidatorFn[] = [];\r\n const asyncValidators: AsyncValidatorFn[] = [];\r\n // const asyncValidators: AsyncValidatorFn[] = [];\r\n if (this.required) {\r\n validators.push(Validators.required);\r\n }\r\n if (this.#validator) {\r\n asyncValidators.push(HandleSdCustomValidator(this.#validator));\r\n }\r\n if (this.inlineError) {\r\n validators.push(this.customInlineErrorValidator());\r\n }\r\n this.formControl.setValidators(validators);\r\n this.formControl.setAsyncValidators(asyncValidators);\r\n this.formControl.updateValueAndValidity();\r\n };\r\n\r\n // Hàm tạo Validators tùy chỉnh cho inlineError\r\n customInlineErrorValidator(): ValidatorFn {\r\n return (): Record<string, any> \| null => {\r\n return { inlineError: true };\r\n };\r\n }\r\n}\r\n","@if (viewed) {\r\n @if (sdLabelDef?.templateRef) {\r\n <ng-container ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n } @else if (label) {\r\n <div class=\"T14R text-black400\">{{ label }}</div>\r\n }\r\n @if (hyperlink) {\r\n <!-- Nếu có hyperlink thì dùng thẻ a -->\r\n <a [href]=\"hyperlink\">{{ display \| async }}</a>\r\n } @else {\r\n <!-- Ngoài ra dùng thẻ mặc định -->\r\n <div class=\"T14M\">{{ display \| async \| sdEmpty }}</div>\r\n }\r\n} @else {\r\n @if (!appearance && sdLabelDef?.templateRef) {\r\n <ng-container ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n }\r\n @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n }\r\n <div\r\n class=\"d-flex align-items-center\"\r\n [class.sd-view]=\"sdViewDef?.templateRef\"\r\n [class.c-focused]=\"isFocused\"\r\n [class.c-disabled]=\"formControl.disabled\"\r\n (click)=\"onClick()\"\r\n aria-hidden=\"true\">\r\n @if (sdViewDef?.templateRef && !autocompleteTrigger?.panelOpen && !isFocused) {\r\n <ng-container\r\n ngTemplateOutlet=\"\r\n sdViewDef!.templateRef;\r\n context: {\r\n value: formControl.value,\r\n selectedItem: selected \| async,\r\n }\r\n \">\r\n </ng-container>\r\n } @else {\r\n <mat-form-field\r\n [class.sd-md]=\"size === 'md'\"\r\n [class.sd-sm]=\"size === 'sm'\"\r\n [class.hide-inline-error]=\"hideInlineError\"\r\n [floatLabel]=\"formControl.value ? 'always' : 'auto'\"\r\n [appearance]=\"appearance \|\| 'outline'\">\r\n @if (appearance && label) {\r\n <mat-label style=\"display: inline-block\">\r\n <div style=\"display: flex; align-items: center; gap: 4px\">\r\n <span>{{ label }}</span>\r\n @if (helperText) {\r\n <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n }\r\n </div>\r\n </mat-label>\r\n }\r\n <input\r\n [id]=\"id\"\r\n [formControl]=\"inputControl\"\r\n [placeholder]=\"(controlPlaceHolder \| async) \|\| ''\"\r\n [class.c-selected]=\"formControl.value\"\r\n [matAutocomplete]=\"auto\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n matInput\r\n [autocomplete]=\"id\"\r\n autocorrect=\"off\"\r\n [errorStateMatcher]=\"matcher\"\r\n [required]=\"required\"\r\n #input\r\n #autocompleteTrigger\r\n [attr.data-autoId]=\"autoId\"\r\n aria-hidden=\"true\" />\r\n @if (!loading && formControl.value && !inputControl.disabled) {\r\n <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel</mat-icon>\r\n } @else if (loading) {\r\n <mat-spinner [diameter]=\"20\" matSuffix></mat-spinner>\r\n } @else {\r\n <mat-icon class=\"pointer sd-suffix-icon\" matSuffix>search</mat-icon>\r\n }\r\n <!-- <i [class.d-none]=\"!loading\" class=\"fa fa-spinner fa-pulse c-loading-icon\"></i> -->\r\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelect($event.option.value)\" class=\"sd-autocomplete-panel\">\r\n @let items = filteredItems \| async;\r\n @if (items?.length) {\r\n <mat-option\r\n ngFor=\"let item of items\"\r\n [value]=\"item\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"displayField ? item[displayField] : item\"\r\n [disabled]=\"item[disabledField]\">\r\n <ng-container ngIf=\"itemDef?.templateRef\">\r\n <ng-container ngTemplateOutlet=\"itemDef?.templateRef ?? null; context: { item: item }\"> </ng-container>\r\n </ng-container>\r\n <ng-container ngIf=\"!itemDef?.templateRef\">\r\n {{ displayField ? item[displayField] : item }}\r\n </ng-container>\r\n </mat-option>\r\n } @else if (!items?.length && inputControl.value && !isTyping && !loading) {}\r\n @if (addable && sdAdd.observers.length) {\r\n <mat-option class=\"sd__option--add\" (keyup.Space)=\"$event.stopPropagation()\" disabled=\"true\">\r\n <div (click)=\"onAdd($event)\">\r\n <mat-icon class=\"mr-1\">add</mat-icon>\r\n {{ 'New item' }}\r\n </div>\r\n </mat-option>\r\n }\r\n </mat-autocomplete>\r\n @if (formControl.errors?.['required']) {\r\n <mat-error>\r\n @if (!hideInlineError) {\r\n Vui lòng nhập thông tin\r\n }\r\n </mat-error>\r\n }\r\n @if (formControl.errors?.['customValidator']) {\r\n <mat-error>\r\n @if (!hideInlineError) {\r\n {{ formControl.errors?.['customValidator'] }}\r\n }\r\n </mat-error>\r\n }\r\n </mat-form-field>\r\n }\r\n </div>\r\n}\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/sd-angular-core-forms-date.mjs CHANGED Viewed

@@ -310,7 +310,7 @@ class SdDate {
                     monthYearA11yLabel: 'MMMM YYYY',
                 },
             }),
-        ], queries: [{ propertyName: "sdViewDef", first: true, predicate: SdViewDefDirective, descendants: true }, { propertyName: "sdLabelDef", first: true, predicate: SdLabelDefDirective, descendants: true }], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "datePicker", first: true, predicate: MatDatepicker, descendants: true }], ngImport: i0, template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ formControl.value }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T16M\">{{ formControl.value | date: 'dd/MM/yyyy' | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <!-- Th\u00EAm area-hidden=true \u0111\u1EC3 kh\u00F4ng b\u1ECB c\u1EA3nh b\u00E1o g\u1EAFn s\u1EF1 ki\u1EC7n click th\u1EBB div -->\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !isFocused && !datePicker?.opened) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        class=\"c-form-field-date-input\"\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [appearance]=\"appearance\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          aria-hidden=\"true\"\r\n          [id]=\"id\"\r\n          matInput\r\n          (keyup)=\"onKeyup($event)\"\r\n          (keydown)=\"onKeyDown($event)\"\r\n          (dateChange)=\"onChange($event)\"\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [formControl]=\"formControl\"\r\n          [required]=\"required\"\r\n          [matDatepicker]=\"picker2\"\r\n          [placeholder]=\"placeholder || label || ''\"\r\n          [min]=\"min\"\r\n          [max]=\"max\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          [attr.data-autoId]=\"autoId\"\r\n          #input\r\n          [maxLength]=\"10\" />\r\n        @if (formControl.value && !required && !formControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel </mat-icon>\r\n        }\r\n\r\n        <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!formControl.disabled && picker2.open()\" #btn matSuffix>today </mat-icon>\r\n\r\n        <mat-datepicker #picker2 [touchUi]=\"isMobileOrTablet\"></mat-datepicker>\r\n\r\n        @if (formControl.errors?.['required'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Vui l\u00F2ng nh\u1EADp th\u00F4ng tin' }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMin'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y nh\u1ECF nh\u1EA5t' }}: <strong>{{ min | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMax'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y l\u1EDBn nh\u1EA5t' }}: <strong>{{ max | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatetimePickerParse'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Parse error' }}: <strong>{{ formControl.errors?.['matDatetimePickerParse']?.text }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['date'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['date'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['inlineError'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ inlineError }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field-icon-suffix{display:flex}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: SdLabel, selector: "sd-label", inputs: ["label", "description", "required", "helperText"] }, { kind: "pipe", type: SdEmptyPipe, name: "sdEmpty" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], queries: [{ propertyName: "sdViewDef", first: true, predicate: SdViewDefDirective, descendants: true }, { propertyName: "sdLabelDef", first: true, predicate: SdLabelDefDirective, descendants: true }], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "datePicker", first: true, predicate: MatDatepicker, descendants: true }], ngImport: i0, template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ formControl.value }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T14M\">{{ formControl.value | date: 'dd/MM/yyyy' | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <!-- Th\u00EAm area-hidden=true \u0111\u1EC3 kh\u00F4ng b\u1ECB c\u1EA3nh b\u00E1o g\u1EAFn s\u1EF1 ki\u1EC7n click th\u1EBB div -->\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !isFocused && !datePicker?.opened) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        class=\"c-form-field-date-input\"\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [appearance]=\"appearance\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          aria-hidden=\"true\"\r\n          [id]=\"id\"\r\n          matInput\r\n          (keyup)=\"onKeyup($event)\"\r\n          (keydown)=\"onKeyDown($event)\"\r\n          (dateChange)=\"onChange($event)\"\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [formControl]=\"formControl\"\r\n          [required]=\"required\"\r\n          [matDatepicker]=\"picker2\"\r\n          [placeholder]=\"placeholder || label || ''\"\r\n          [min]=\"min\"\r\n          [max]=\"max\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          [attr.data-autoId]=\"autoId\"\r\n          #input\r\n          [maxLength]=\"10\" />\r\n        @if (formControl.value && !required && !formControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel </mat-icon>\r\n        }\r\n\r\n        <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!formControl.disabled && picker2.open()\" #btn matSuffix>today </mat-icon>\r\n\r\n        <mat-datepicker #picker2 [touchUi]=\"isMobileOrTablet\"></mat-datepicker>\r\n\r\n        @if (formControl.errors?.['required'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Vui l\u00F2ng nh\u1EADp th\u00F4ng tin' }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMin'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y nh\u1ECF nh\u1EA5t' }}: <strong>{{ min | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMax'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y l\u1EDBn nh\u1EA5t' }}: <strong>{{ max | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatetimePickerParse'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Parse error' }}: <strong>{{ formControl.errors?.['matDatetimePickerParse']?.text }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['date'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['date'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['inlineError'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ inlineError }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field-icon-suffix{display:flex}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: SdLabel, selector: "sd-label", inputs: ["label", "description", "required", "helperText"] }, { kind: "pipe", type: SdEmptyPipe, name: "sdEmpty" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdDate, decorators: [{
             type: Component,
@@ -337,7 +337,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                         MatDatepickerModule,
                         SdLabel,
                         SdEmptyPipe
-                    ], template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ formControl.value }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T16M\">{{ formControl.value | date: 'dd/MM/yyyy' | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <!-- Th\u00EAm area-hidden=true \u0111\u1EC3 kh\u00F4ng b\u1ECB c\u1EA3nh b\u00E1o g\u1EAFn s\u1EF1 ki\u1EC7n click th\u1EBB div -->\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !isFocused && !datePicker?.opened) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        class=\"c-form-field-date-input\"\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [appearance]=\"appearance\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          aria-hidden=\"true\"\r\n          [id]=\"id\"\r\n          matInput\r\n          (keyup)=\"onKeyup($event)\"\r\n          (keydown)=\"onKeyDown($event)\"\r\n          (dateChange)=\"onChange($event)\"\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [formControl]=\"formControl\"\r\n          [required]=\"required\"\r\n          [matDatepicker]=\"picker2\"\r\n          [placeholder]=\"placeholder || label || ''\"\r\n          [min]=\"min\"\r\n          [max]=\"max\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          [attr.data-autoId]=\"autoId\"\r\n          #input\r\n          [maxLength]=\"10\" />\r\n        @if (formControl.value && !required && !formControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel </mat-icon>\r\n        }\r\n\r\n        <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!formControl.disabled && picker2.open()\" #btn matSuffix>today </mat-icon>\r\n\r\n        <mat-datepicker #picker2 [touchUi]=\"isMobileOrTablet\"></mat-datepicker>\r\n\r\n        @if (formControl.errors?.['required'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Vui l\u00F2ng nh\u1EADp th\u00F4ng tin' }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMin'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y nh\u1ECF nh\u1EA5t' }}: <strong>{{ min | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMax'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y l\u1EDBn nh\u1EA5t' }}: <strong>{{ max | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatetimePickerParse'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Parse error' }}: <strong>{{ formControl.errors?.['matDatetimePickerParse']?.text }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['date'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['date'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['inlineError'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ inlineError }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field-icon-suffix{display:flex}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}\n"] }]
+                    ], template: "@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  @if (hyperlink) {\r\n    <!-- N\u1EBFu c\u00F3 hyperlink th\u00EC d\u00F9ng th\u1EBB a -->\r\n    <a [href]=\"hyperlink\">{{ formControl.value }}</a>\r\n  } @else {\r\n    <!-- Ngo\u00E0i ra d\u00F9ng th\u1EBB m\u1EB7c \u0111\u1ECBnh -->\r\n    <div class=\"T14M\">{{ formControl.value | date: 'dd/MM/yyyy' | sdEmpty }}</div>\r\n  }\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef?.templateRef!\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <!-- Th\u00EAm area-hidden=true \u0111\u1EC3 kh\u00F4ng b\u1ECB c\u1EA3nh b\u00E1o g\u1EAFn s\u1EF1 ki\u1EC7n click th\u1EBB div -->\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !isFocused && !datePicker?.opened) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        class=\"c-form-field-date-input\"\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [appearance]=\"appearance\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"below\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <input\r\n          aria-hidden=\"true\"\r\n          [id]=\"id\"\r\n          matInput\r\n          (keyup)=\"onKeyup($event)\"\r\n          (keydown)=\"onKeyDown($event)\"\r\n          (dateChange)=\"onChange($event)\"\r\n          [autocomplete]=\"id\"\r\n          autocorrect=\"off\"\r\n          [formControl]=\"formControl\"\r\n          [required]=\"required\"\r\n          [matDatepicker]=\"picker2\"\r\n          [placeholder]=\"placeholder || label || ''\"\r\n          [min]=\"min\"\r\n          [max]=\"max\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          [attr.data-autoId]=\"autoId\"\r\n          #input\r\n          [maxLength]=\"10\" />\r\n        @if (formControl.value && !required && !formControl.disabled) {\r\n          <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"clear($event)\" matSuffix>cancel </mat-icon>\r\n        }\r\n\r\n        <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!formControl.disabled && picker2.open()\" #btn matSuffix>today </mat-icon>\r\n\r\n        <mat-datepicker #picker2 [touchUi]=\"isMobileOrTablet\"></mat-datepicker>\r\n\r\n        @if (formControl.errors?.['required'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Vui l\u00F2ng nh\u1EADp th\u00F4ng tin' }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMin'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y nh\u1ECF nh\u1EA5t' }}: <strong>{{ min | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatepickerMax'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Ng\u00E0y l\u1EDBn nh\u1EA5t' }}: <strong>{{ max | date: 'dd/MM/yyyy' }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['matDatetimePickerParse'] && formControl.touched && !isFocused) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ 'Parse error' }}: <strong>{{ formControl.errors?.['matDatetimePickerParse']?.text }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['customValidator'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['date'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ formControl.errors?.['date'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n        @if (formControl.errors?.['inlineError'] && formControl.touched) {\r\n          <mat-error>\r\n            @if (!hideInlineError) {\r\n              {{ inlineError }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{padding-top:5px;display:block}:host ::ng-deep .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-mdc-text-field-wrapper{background:var(--sd-black100)}:host ::ng-deep .mat-mdc-form-field input.mat-mdc-input-element:disabled{color:var(--sd-black400)!important}:host ::ng-deep .mat-mdc-form-field .mat-mdc-placeholder-required{color:var(--sd-error)}:host ::ng-deep .mat-mdc-form-field-icon-suffix{display:flex}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [SD_FORM_CONFIGURATION]