@sarasanalytics-com/design-system 0.0.169 → 0.0.171
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.
|
@@ -2310,7 +2310,7 @@ class FormInputComponent extends FieldType {
|
|
|
2310
2310
|
}
|
|
2311
2311
|
}
|
|
2312
2312
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: FormInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2313
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: FormInputComponent, isStandalone: true, selector: "sa-input", inputs: { icon: "icon", params: "params" }, viewQueries: [{ propertyName: "formInput", first: true, predicate: ["formInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"sa-input-container {{props?.['inputContainerClass']}}\" [ngStyle]=\"{'gap': getLabelFieldGap()}\">\r\n @if (!!props?.['bigLabel'] || !!props?.['bigDescription']) {\r\n <div class=\"sa-input-big-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <h2 class=\"sa-input-big-label\">\r\n {{props?.['bigLabel']}}\r\n </h2>\r\n <p class=\"sa-input-big-description\">\r\n {{props?.['bigDescription']}}\r\n </p>\r\n </div>\r\n }\r\n @if(!!props?.['label']){\r\n <div class=\"sa-input-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <div class=\"sa-input-label-tooltip-container\">\r\n <span class=\"sa-input-label\">\r\n {{props?.['label']}}\r\n </span>\r\n @if(!!props?.['tooltip']){\r\n <span class=\"tooltip-container\">\r\n <sa-icon [icon]=\"props?.['tooltipIcon'] || 'infoCircleOutlined'\" customClass=\"info-icon\"\r\n [matTooltip]=\"props?.['tooltip']\" matTooltipClass=\"custom-tooltip\" class=\"tooltip-icon d-flex\"\r\n [size]=\"props?.['tooltipIconSize'] || '20'\"></sa-icon>\r\n </span>\r\n }\r\n </div>\r\n @if(!!props?.['description']) {\r\n <p class=\"sa-input-description\">\r\n {{props?.['description']}}\r\n </p>\r\n }\r\n </div>\r\n }\r\n <div class=\"sa-input\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n @if((pretext || (!!inputVal?.length && (!!params?.placeholder || !!props?.placeholder))) && props?.['showTag']\r\n !== false){\r\n <span class=\"sa-input-tag\">{{params?.placeholder || props?.placeholder}}</span>\r\n }\r\n <div class=\"sa-input-field\" [ngClass]=\"formControl.invalid && formControl.touched ? 'invalid' : 'idle' \"\r\n (click)=\"onInputFieldClick($event)\">\r\n @if(pretext){\r\n <div class=\"sa-input-pretext\">\r\n {{pretext}}\r\n </div>\r\n }\r\n\r\n <!-- Multi-value chip display -->\r\n @if(isMultiValue) {\r\n <div class=\"chip-container\">\r\n <sa-chip \r\n *ngFor=\"let chip of (chipValues || [])?.slice(startInd,startInd+labelLimit) let i = index\"\r\n [text]=\"chip?.value || chip?.label || chip\"\r\n [type]=\"'regular'\"\r\n [state]=\"'primary'\"\r\n [filling]=\"'filled'\"\r\n [iconPosition]=\"'right'\"\r\n [iconPath]=\"'../assets/closeBlueOutlined.svg'\"\r\n (onClickEvent)=\"removeChip(i)\">\r\n </sa-chip>\r\n \r\n <div (click)=\"shiftLabel('clicked')\" class=\"ng-value overflow-label\"\r\n *ngIf=\"(chipValues || []).length > (startInd + labelLimit)\">\r\n <sa-chip [text]=\"'+' + ((chipValues || []).length - (startInd + labelLimit))\" \r\n type=\"regular\" \r\n state=\"primary\" \r\n filling=\"filled\">\r\n </sa-chip>\r\n </div>\r\n <input\r\n [ngClass]=\"'chip-input'\"\r\n matInput [type]=\"type\"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"chipValues.length === 0 ? (props?.placeholder || params?.placeholder || '') : ''\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onChipBlur()\"\r\n (input)=\"onChipInputChange($event)\"\r\n (keydown)=\"onChipKeyDown($event)\"\r\n [(ngModel)]=\"currentInputValue\"\r\n #formInput />\r\n </div>\r\n } @else {\r\n <!-- Standard single-value input (backward compatibility) -->\r\n @if(!!props?.['prefix']){\r\n <span matPrefix>{{props?.['prefix']}} </span>\r\n }\r\n <input\r\n [ngClass]=\"(!!inputVal && (params?.type === 'password' || props?.type === 'password') && icon.name !== 'eyeOff') ? 'masked' : ''\"\r\n matInput [type]=\"props?.type || type\" value=\"\" [pattern]=\"type==='tel' ? '[0-9]' : '' \"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"!pretext && props?.placeholder || params?.placeholder || ''\" (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\" (input)=\"onInput($event)\" [(ngModel)]=\"inputVal\" #formInput />\r\n }\r\n\r\n @if(params?.type === 'password'){\r\n <sa-icon class=\"flex\" icon=\"eyeOutlined\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"!icon.name || icon.name === 'eyeOutlined' ? '' : 'hide'\"></sa-icon>\r\n <sa-icon class=\"flex\" icon=\"eyeOff\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"icon.name === 'eyeOff' ? '' : 'hide'\"></sa-icon>\r\n }@else if(params?.type === 'email' && icon.show){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name || 'checkCircleOutlined'\" [size]=\"icon.size || '24'\"\r\n (click)=\"inputIconClick()\" [ngClass]=\"showEmailIcon ? '' : 'hide'\"></sa-icon>\r\n }\r\n @else if(icon?.name){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name\" [size]=\"icon?.size || '24'\" [color]=\"icon?.color || ''\"\r\n [ngClass]=\"icon?.show ? '' : 'hide'\"></sa-icon>\r\n }\r\n </div>\r\n @if((!formControl.valid) || (params?.supportText)){\r\n <div class=\"support-label {{formControl.invalid && formControl.touched ? params?.className : ''}}\" [ngClass]=\"[\r\n formControl.invalid && formControl.touched ? 'invalid' : 'idle'\r\n ]\">\r\n <!-- {{!formControl.valid ? inputErrorText : params.supportText}} -->\r\n {{getFormSupportText()}}\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: ["*{--error-red: #e25c61 }.idle{--border: 1px solid var(--grey-50)}.focus{--border: 1px solid var(--primary-300)}.masked{font-size:28px;font-weight:500;padding-top:4px}.disabled .sa-input-field,[disabled]{background-color:#fafafa;cursor:not-allowed}.disabled .sa-input-field input{color:#989da3}.sa-input-field>input,.sa-input-field>input:focus-visible{--border: 1px solid var(--primary-300);border:none;outline:none}.sa-input-field:hover{--border: 1px solid var(--primary-300);--font-color: var(--text-highemphasis)}.sa-input-field sa-icon{color:var(--icon-grey1)}.sa-input-field>input:focus-visible~sa-icon,.sa-input-field:hover sa-icon{color:var(--primary-300)}.sa-input-field.invalid>input,.sa-input-field.invalid sa-icon,.sa-input-field.invalid .sa-input-pretext{color:var(--semantic-error-500, #BD271E)}.sa-input-field.invalid{--border: 1px solid var(--semantic-error-500, #BD271E)}.sa-input-field.invalid sa-icon{--form-email-icon-color: var(--semantic-error-500, #BD271E)}.sa-input-field.idle sa-icon{--form-email-icon-color: #33961F}.sa-input{position:relative;padding:8px 0}.sa-input-pretext{margin-right:2px}.sa-input-field{width:100%;box-sizing:border-box;position:relative;display:inline-flex;padding:0px var(--small-12px);height:40px;justify-content:center;align-items:center;border:var(--border);border-radius:var(--small-4px);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.25px;--font-color: var(--text-lowemphasis)}.sa-input-field input{width:inherit}.sa-input-tag{position:absolute;background:#fff;padding:2px 6px;top:-1px;left:12px;z-index:2;font-size:11px;font-weight:500;line-height:16px;letter-spacing:.5px;text-align:left;color:var(--text-lowemphasis)}.support-label{font-family:var(--font);font-size:11px;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.5px;color:var(--text-lowemphasis);padding:var(--small-4px) var(--small-16px) 0px var(--small-16px)}.support-label.invalid{color:var(--error-red)}.hide{display:none}.sa-input-big-label-container,.sa-input-label-container{display:flex;flex-direction:column;gap:var(--small-8px, 8px)}.sa-input-big-label{color:var(--text-highemphasis, #1C1B20);font-family:var(--font-roboto, Roboto);font-size:var(--medium-22px, 22px);font-style:normal;font-weight:500;line-height:var(--medium-28px, 28px);margin:0}.sa-input-big-description,.sa-input-description{color:var(--text-mediumemphasis, #6D6979);font-family:var(--font-roboto, Roboto);font-size:var(--small-14px, 14px);font-style:normal;font-weight:400;line-height:var(--medium-20px, 20px);letter-spacing:.25px;margin:0}.sa-input-container{display:flex;flex-direction:column;gap:var(--medium-20px, 20px)}.sa-input-label{color:var(--text-highemphasis, #1B1D20);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:500;line-height:var(--medium-20px);letter-spacing:.1px}.sa-input-label-tooltip-container{display:flex;gap:var(--small-4px);align-items:center}.d-flex{display:flex}.chip-container{display:flex;flex-wrap:wrap;align-items:center;gap:4px;width:100%;min-height:20px}.chip-input{border:none;outline:none;background:transparent;flex:1;min-width:60px;font-size:14px;font-family:inherit;color:inherit}.chip-input::placeholder{color:var(--text-medium-emphasis, #6D6979)}.chip-container sa-chip{margin:2px 0}@media screen and (max-width: 1024px){.masked{font-weight:unset}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: IconComponent, selector: "sa-icon", inputs: ["img", "imgWidth", "imgHeight", "icon", "size", "color", "iconPath", "iconUrl", "customClass", "href", "hrefTarget", "iconPosition"], outputs: ["onClickEvent"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ChipsComponent, selector: "sa-chip", inputs: ["id", "iconPath", "text", "type", "state", "filling", "iconPosition", "largeStateIcon", "largeStateText", "tooltip", "className"], outputs: ["onClickEvent"] }] }); }
|
|
2313
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: FormInputComponent, isStandalone: true, selector: "sa-input", inputs: { icon: "icon", params: "params" }, viewQueries: [{ propertyName: "formInput", first: true, predicate: ["formInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"sa-input-container {{props?.['inputContainerClass']}}\" [ngStyle]=\"{'gap': getLabelFieldGap()}\">\r\n @if (!!props?.['bigLabel'] || !!props?.['bigDescription']) {\r\n <div class=\"sa-input-big-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <h2 class=\"sa-input-big-label\">\r\n {{props?.['bigLabel']}}\r\n </h2>\r\n <p class=\"sa-input-big-description\">\r\n {{props?.['bigDescription']}}\r\n </p>\r\n </div>\r\n }\r\n @if(!!props?.['label']){\r\n <div class=\"sa-input-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <div class=\"sa-input-label-tooltip-container\">\r\n <span class=\"sa-input-label\">\r\n {{props?.['label']}}\r\n </span>\r\n @if(!!props?.['tooltip']){\r\n <span class=\"tooltip-container\">\r\n <sa-icon [icon]=\"props?.['tooltipIcon'] || 'infoCircleOutlined'\" customClass=\"info-icon\"\r\n [matTooltip]=\"props?.['tooltip']\" matTooltipClass=\"custom-tooltip\" class=\"tooltip-icon d-flex\"\r\n [size]=\"props?.['tooltipIconSize'] || '20'\"></sa-icon>\r\n </span>\r\n }\r\n </div>\r\n @if(!!props?.['description']) {\r\n <p class=\"sa-input-description\">\r\n {{props?.['description']}}\r\n </p>\r\n }\r\n </div>\r\n }\r\n <div class=\"sa-input\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n @if((pretext || (!!inputVal?.length && (!!params?.placeholder || !!props?.placeholder))) && props?.['showTag']\r\n !== false){\r\n <span class=\"sa-input-tag\">{{params?.placeholder || props?.placeholder}}</span>\r\n }\r\n <div class=\"sa-input-field\" [ngClass]=\"formControl.invalid && formControl.touched ? 'invalid' : 'idle' \"\r\n (click)=\"onInputFieldClick($event)\">\r\n @if(pretext){\r\n <div class=\"sa-input-pretext\">\r\n {{pretext}}\r\n </div>\r\n }\r\n\r\n <!-- Multi-value chip display -->\r\n @if(isMultiValue) {\r\n <div class=\"chip-container\">\r\n <sa-chip \r\n *ngFor=\"let chip of (chipValues || [])?.slice(startInd,startInd+labelLimit) let i = index\"\r\n [text]=\"chip?.value || chip?.label || chip\"\r\n [type]=\"'regular'\"\r\n [state]=\"'primary'\"\r\n [filling]=\"'filled'\"\r\n [iconPosition]=\"'right'\"\r\n [iconPath]=\"'../assets/closeBlueOutlined.svg'\"\r\n (onClickEvent)=\"removeChip(i)\">\r\n </sa-chip>\r\n \r\n <div (click)=\"shiftLabel('clicked')\" class=\"ng-value overflow-label\"\r\n *ngIf=\"(chipValues || []).length > (startInd + labelLimit)\">\r\n <sa-chip [text]=\"'+' + ((chipValues || []).length - (startInd + labelLimit))\" \r\n type=\"regular\" \r\n state=\"primary\" \r\n filling=\"filled\">\r\n </sa-chip>\r\n </div>\r\n <input\r\n [ngClass]=\"'chip-input'\"\r\n matInput [type]=\"type\"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"chipValues.length === 0 ? (props?.placeholder || params?.placeholder || '') : ''\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onChipBlur()\"\r\n (input)=\"onChipInputChange($event)\"\r\n (keydown)=\"onChipKeyDown($event)\"\r\n [(ngModel)]=\"currentInputValue\"\r\n #formInput />\r\n </div>\r\n } @else {\r\n <!-- Standard single-value input (backward compatibility) -->\r\n @if(!!props?.['prefix']){\r\n <span matPrefix>{{props?.['prefix']}} </span>\r\n }\r\n <input\r\n [ngClass]=\"(!!inputVal && (params?.type === 'password' || props?.type === 'password') && icon.name !== 'eyeOff') ? 'masked' : ''\"\r\n matInput [type]=\"props?.type || type\" value=\"\" [pattern]=\"type==='tel' ? '[0-9]' : '' \"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"!pretext && props?.placeholder || params?.placeholder || ''\" (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\" (input)=\"onInput($event)\" [(ngModel)]=\"inputVal\" #formInput />\r\n }\r\n\r\n @if(params?.type === 'password'){\r\n <sa-icon class=\"flex\" icon=\"eyeOutlined\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"!icon.name || icon.name === 'eyeOutlined' ? '' : 'hide'\"></sa-icon>\r\n <sa-icon class=\"flex\" icon=\"eyeOff\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"icon.name === 'eyeOff' ? '' : 'hide'\"></sa-icon>\r\n }@else if(params?.type === 'email' && icon.show){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name || 'checkCircleOutlined'\" [size]=\"icon.size || '24'\"\r\n (click)=\"inputIconClick()\" [ngClass]=\"showEmailIcon ? '' : 'hide'\"></sa-icon>\r\n }\r\n @else if(icon?.name){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name\" [size]=\"icon?.size || '24'\" [color]=\"icon?.color || ''\"\r\n [ngClass]=\"icon?.show ? '' : 'hide'\"></sa-icon>\r\n }\r\n </div>\r\n @if((!formControl.valid) || (params?.supportText)){\r\n <div class=\"support-label {{formControl.invalid && formControl.touched ? params?.className : ''}}\" [ngClass]=\"[\r\n formControl.invalid && formControl.touched ? 'invalid' : 'idle'\r\n ]\">\r\n <!-- {{!formControl.valid ? inputErrorText : params.supportText}} -->\r\n {{getFormSupportText()}}\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: ["*{--error-red: #e25c61 }.idle{--border: 1px solid var(--grey-50)}.focus{--border: 1px solid var(--primary-300)}.masked{font-size:28px;font-weight:500;padding-top:4px}.disabled .sa-input-field,[disabled]{background-color:#fafafa;cursor:not-allowed}.disabled .sa-input-field input{color:#989da3}.sa-input-field>input,.sa-input-field>input:focus-visible{--border: 1px solid var(--primary-300);border:none;outline:none}.sa-input-field:hover{--border: 1px solid var(--primary-300);--font-color: var(--text-highemphasis)}.sa-input-field sa-icon{color:var(--icon-grey1)}.sa-input-field>input:focus-visible~sa-icon,.sa-input-field:hover sa-icon{color:var(--primary-300)}.sa-input-field.invalid>input,.sa-input-field.invalid sa-icon,.sa-input-field.invalid .sa-input-pretext{color:var(--semantic-error-500, #BD271E)}.sa-input-field.invalid{--border: 1px solid var(--semantic-error-500, #BD271E)}.sa-input-field.invalid sa-icon{--form-email-icon-color: var(--semantic-error-500, #BD271E)}.sa-input-field.idle sa-icon{--form-email-icon-color: #33961F}.sa-input{position:relative;padding:8px 0}.sa-input input:-webkit-autofill,.sa-input input:-webkit-autofill:hover,.sa-input input:-webkit-autofill:focus,.sa-input input:-internal-autofill-selected{background-clip:text;-webkit-background-clip:text}.sa-input .sa-input-field input{background-clip:text;-webkit-background-clip:text;font-weight:unset}.sa-input-pretext{margin-right:2px}.sa-input-field{width:100%;box-sizing:border-box;position:relative;display:inline-flex;padding:0px var(--small-12px);height:40px;justify-content:center;align-items:center;border:var(--border);border-radius:var(--small-4px);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.25px;--font-color: var(--text-lowemphasis)}.sa-input-field input{width:inherit}.sa-input-tag{position:absolute;background:#fff;padding:2px 6px;top:-1px;left:12px;z-index:2;font-size:11px;font-weight:500;line-height:16px;letter-spacing:.5px;text-align:left;color:var(--text-lowemphasis)}.support-label{font-family:var(--font);font-size:11px;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.5px;color:var(--text-lowemphasis);padding:var(--small-4px) var(--small-16px) 0px var(--small-16px)}.support-label.invalid{color:var(--error-red)}.hide{display:none}.sa-input-big-label-container,.sa-input-label-container{display:flex;flex-direction:column;gap:var(--small-8px, 8px)}.sa-input-big-label{color:var(--text-highemphasis, #1C1B20);font-family:var(--font-roboto, Roboto);font-size:var(--medium-22px, 22px);font-style:normal;font-weight:500;line-height:var(--medium-28px, 28px);margin:0}.sa-input-big-description,.sa-input-description{color:var(--text-mediumemphasis, #6D6979);font-family:var(--font-roboto, Roboto);font-size:var(--small-14px, 14px);font-style:normal;font-weight:400;line-height:var(--medium-20px, 20px);letter-spacing:.25px;margin:0}.sa-input-container{display:flex;flex-direction:column;gap:var(--medium-20px, 20px)}.sa-input-label{color:var(--text-highemphasis, #1B1D20);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:500;line-height:var(--medium-20px);letter-spacing:.1px}.sa-input-label-tooltip-container{display:flex;gap:var(--small-4px);align-items:center}.d-flex{display:flex}.chip-container{display:flex;flex-wrap:wrap;align-items:center;gap:4px;width:100%;min-height:20px}.chip-input{border:none;outline:none;background:transparent;flex:1;min-width:60px;font-size:14px;font-family:inherit;color:inherit}.chip-input::placeholder{color:var(--text-medium-emphasis, #6D6979)}.chip-container sa-chip{margin:2px 0}@media screen and (max-width: 1024px){.masked{font-weight:unset}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: IconComponent, selector: "sa-icon", inputs: ["img", "imgWidth", "imgHeight", "icon", "size", "color", "iconPath", "iconUrl", "customClass", "href", "hrefTarget", "iconPosition"], outputs: ["onClickEvent"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ChipsComponent, selector: "sa-chip", inputs: ["id", "iconPath", "text", "type", "state", "filling", "iconPosition", "largeStateIcon", "largeStateText", "tooltip", "className"], outputs: ["onClickEvent"] }] }); }
|
|
2314
2314
|
}
|
|
2315
2315
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: FormInputComponent, decorators: [{
|
|
2316
2316
|
type: Component,
|
|
@@ -2322,7 +2322,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
2322
2322
|
IconComponent,
|
|
2323
2323
|
MatTooltipModule,
|
|
2324
2324
|
ChipsComponent
|
|
2325
|
-
], template: "<div class=\"sa-input-container {{props?.['inputContainerClass']}}\" [ngStyle]=\"{'gap': getLabelFieldGap()}\">\r\n @if (!!props?.['bigLabel'] || !!props?.['bigDescription']) {\r\n <div class=\"sa-input-big-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <h2 class=\"sa-input-big-label\">\r\n {{props?.['bigLabel']}}\r\n </h2>\r\n <p class=\"sa-input-big-description\">\r\n {{props?.['bigDescription']}}\r\n </p>\r\n </div>\r\n }\r\n @if(!!props?.['label']){\r\n <div class=\"sa-input-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <div class=\"sa-input-label-tooltip-container\">\r\n <span class=\"sa-input-label\">\r\n {{props?.['label']}}\r\n </span>\r\n @if(!!props?.['tooltip']){\r\n <span class=\"tooltip-container\">\r\n <sa-icon [icon]=\"props?.['tooltipIcon'] || 'infoCircleOutlined'\" customClass=\"info-icon\"\r\n [matTooltip]=\"props?.['tooltip']\" matTooltipClass=\"custom-tooltip\" class=\"tooltip-icon d-flex\"\r\n [size]=\"props?.['tooltipIconSize'] || '20'\"></sa-icon>\r\n </span>\r\n }\r\n </div>\r\n @if(!!props?.['description']) {\r\n <p class=\"sa-input-description\">\r\n {{props?.['description']}}\r\n </p>\r\n }\r\n </div>\r\n }\r\n <div class=\"sa-input\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n @if((pretext || (!!inputVal?.length && (!!params?.placeholder || !!props?.placeholder))) && props?.['showTag']\r\n !== false){\r\n <span class=\"sa-input-tag\">{{params?.placeholder || props?.placeholder}}</span>\r\n }\r\n <div class=\"sa-input-field\" [ngClass]=\"formControl.invalid && formControl.touched ? 'invalid' : 'idle' \"\r\n (click)=\"onInputFieldClick($event)\">\r\n @if(pretext){\r\n <div class=\"sa-input-pretext\">\r\n {{pretext}}\r\n </div>\r\n }\r\n\r\n <!-- Multi-value chip display -->\r\n @if(isMultiValue) {\r\n <div class=\"chip-container\">\r\n <sa-chip \r\n *ngFor=\"let chip of (chipValues || [])?.slice(startInd,startInd+labelLimit) let i = index\"\r\n [text]=\"chip?.value || chip?.label || chip\"\r\n [type]=\"'regular'\"\r\n [state]=\"'primary'\"\r\n [filling]=\"'filled'\"\r\n [iconPosition]=\"'right'\"\r\n [iconPath]=\"'../assets/closeBlueOutlined.svg'\"\r\n (onClickEvent)=\"removeChip(i)\">\r\n </sa-chip>\r\n \r\n <div (click)=\"shiftLabel('clicked')\" class=\"ng-value overflow-label\"\r\n *ngIf=\"(chipValues || []).length > (startInd + labelLimit)\">\r\n <sa-chip [text]=\"'+' + ((chipValues || []).length - (startInd + labelLimit))\" \r\n type=\"regular\" \r\n state=\"primary\" \r\n filling=\"filled\">\r\n </sa-chip>\r\n </div>\r\n <input\r\n [ngClass]=\"'chip-input'\"\r\n matInput [type]=\"type\"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"chipValues.length === 0 ? (props?.placeholder || params?.placeholder || '') : ''\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onChipBlur()\"\r\n (input)=\"onChipInputChange($event)\"\r\n (keydown)=\"onChipKeyDown($event)\"\r\n [(ngModel)]=\"currentInputValue\"\r\n #formInput />\r\n </div>\r\n } @else {\r\n <!-- Standard single-value input (backward compatibility) -->\r\n @if(!!props?.['prefix']){\r\n <span matPrefix>{{props?.['prefix']}} </span>\r\n }\r\n <input\r\n [ngClass]=\"(!!inputVal && (params?.type === 'password' || props?.type === 'password') && icon.name !== 'eyeOff') ? 'masked' : ''\"\r\n matInput [type]=\"props?.type || type\" value=\"\" [pattern]=\"type==='tel' ? '[0-9]' : '' \"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"!pretext && props?.placeholder || params?.placeholder || ''\" (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\" (input)=\"onInput($event)\" [(ngModel)]=\"inputVal\" #formInput />\r\n }\r\n\r\n @if(params?.type === 'password'){\r\n <sa-icon class=\"flex\" icon=\"eyeOutlined\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"!icon.name || icon.name === 'eyeOutlined' ? '' : 'hide'\"></sa-icon>\r\n <sa-icon class=\"flex\" icon=\"eyeOff\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"icon.name === 'eyeOff' ? '' : 'hide'\"></sa-icon>\r\n }@else if(params?.type === 'email' && icon.show){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name || 'checkCircleOutlined'\" [size]=\"icon.size || '24'\"\r\n (click)=\"inputIconClick()\" [ngClass]=\"showEmailIcon ? '' : 'hide'\"></sa-icon>\r\n }\r\n @else if(icon?.name){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name\" [size]=\"icon?.size || '24'\" [color]=\"icon?.color || ''\"\r\n [ngClass]=\"icon?.show ? '' : 'hide'\"></sa-icon>\r\n }\r\n </div>\r\n @if((!formControl.valid) || (params?.supportText)){\r\n <div class=\"support-label {{formControl.invalid && formControl.touched ? params?.className : ''}}\" [ngClass]=\"[\r\n formControl.invalid && formControl.touched ? 'invalid' : 'idle'\r\n ]\">\r\n <!-- {{!formControl.valid ? inputErrorText : params.supportText}} -->\r\n {{getFormSupportText()}}\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: ["*{--error-red: #e25c61 }.idle{--border: 1px solid var(--grey-50)}.focus{--border: 1px solid var(--primary-300)}.masked{font-size:28px;font-weight:500;padding-top:4px}.disabled .sa-input-field,[disabled]{background-color:#fafafa;cursor:not-allowed}.disabled .sa-input-field input{color:#989da3}.sa-input-field>input,.sa-input-field>input:focus-visible{--border: 1px solid var(--primary-300);border:none;outline:none}.sa-input-field:hover{--border: 1px solid var(--primary-300);--font-color: var(--text-highemphasis)}.sa-input-field sa-icon{color:var(--icon-grey1)}.sa-input-field>input:focus-visible~sa-icon,.sa-input-field:hover sa-icon{color:var(--primary-300)}.sa-input-field.invalid>input,.sa-input-field.invalid sa-icon,.sa-input-field.invalid .sa-input-pretext{color:var(--semantic-error-500, #BD271E)}.sa-input-field.invalid{--border: 1px solid var(--semantic-error-500, #BD271E)}.sa-input-field.invalid sa-icon{--form-email-icon-color: var(--semantic-error-500, #BD271E)}.sa-input-field.idle sa-icon{--form-email-icon-color: #33961F}.sa-input{position:relative;padding:8px 0}.sa-input-pretext{margin-right:2px}.sa-input-field{width:100%;box-sizing:border-box;position:relative;display:inline-flex;padding:0px var(--small-12px);height:40px;justify-content:center;align-items:center;border:var(--border);border-radius:var(--small-4px);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.25px;--font-color: var(--text-lowemphasis)}.sa-input-field input{width:inherit}.sa-input-tag{position:absolute;background:#fff;padding:2px 6px;top:-1px;left:12px;z-index:2;font-size:11px;font-weight:500;line-height:16px;letter-spacing:.5px;text-align:left;color:var(--text-lowemphasis)}.support-label{font-family:var(--font);font-size:11px;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.5px;color:var(--text-lowemphasis);padding:var(--small-4px) var(--small-16px) 0px var(--small-16px)}.support-label.invalid{color:var(--error-red)}.hide{display:none}.sa-input-big-label-container,.sa-input-label-container{display:flex;flex-direction:column;gap:var(--small-8px, 8px)}.sa-input-big-label{color:var(--text-highemphasis, #1C1B20);font-family:var(--font-roboto, Roboto);font-size:var(--medium-22px, 22px);font-style:normal;font-weight:500;line-height:var(--medium-28px, 28px);margin:0}.sa-input-big-description,.sa-input-description{color:var(--text-mediumemphasis, #6D6979);font-family:var(--font-roboto, Roboto);font-size:var(--small-14px, 14px);font-style:normal;font-weight:400;line-height:var(--medium-20px, 20px);letter-spacing:.25px;margin:0}.sa-input-container{display:flex;flex-direction:column;gap:var(--medium-20px, 20px)}.sa-input-label{color:var(--text-highemphasis, #1B1D20);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:500;line-height:var(--medium-20px);letter-spacing:.1px}.sa-input-label-tooltip-container{display:flex;gap:var(--small-4px);align-items:center}.d-flex{display:flex}.chip-container{display:flex;flex-wrap:wrap;align-items:center;gap:4px;width:100%;min-height:20px}.chip-input{border:none;outline:none;background:transparent;flex:1;min-width:60px;font-size:14px;font-family:inherit;color:inherit}.chip-input::placeholder{color:var(--text-medium-emphasis, #6D6979)}.chip-container sa-chip{margin:2px 0}@media screen and (max-width: 1024px){.masked{font-weight:unset}}\n"] }]
|
|
2325
|
+
], template: "<div class=\"sa-input-container {{props?.['inputContainerClass']}}\" [ngStyle]=\"{'gap': getLabelFieldGap()}\">\r\n @if (!!props?.['bigLabel'] || !!props?.['bigDescription']) {\r\n <div class=\"sa-input-big-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <h2 class=\"sa-input-big-label\">\r\n {{props?.['bigLabel']}}\r\n </h2>\r\n <p class=\"sa-input-big-description\">\r\n {{props?.['bigDescription']}}\r\n </p>\r\n </div>\r\n }\r\n @if(!!props?.['label']){\r\n <div class=\"sa-input-label-container\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n <div class=\"sa-input-label-tooltip-container\">\r\n <span class=\"sa-input-label\">\r\n {{props?.['label']}}\r\n </span>\r\n @if(!!props?.['tooltip']){\r\n <span class=\"tooltip-container\">\r\n <sa-icon [icon]=\"props?.['tooltipIcon'] || 'infoCircleOutlined'\" customClass=\"info-icon\"\r\n [matTooltip]=\"props?.['tooltip']\" matTooltipClass=\"custom-tooltip\" class=\"tooltip-icon d-flex\"\r\n [size]=\"props?.['tooltipIconSize'] || '20'\"></sa-icon>\r\n </span>\r\n }\r\n </div>\r\n @if(!!props?.['description']) {\r\n <p class=\"sa-input-description\">\r\n {{props?.['description']}}\r\n </p>\r\n }\r\n </div>\r\n }\r\n <div class=\"sa-input\" [ngClass]=\"disabled ? 'disabled' : '' \">\r\n @if((pretext || (!!inputVal?.length && (!!params?.placeholder || !!props?.placeholder))) && props?.['showTag']\r\n !== false){\r\n <span class=\"sa-input-tag\">{{params?.placeholder || props?.placeholder}}</span>\r\n }\r\n <div class=\"sa-input-field\" [ngClass]=\"formControl.invalid && formControl.touched ? 'invalid' : 'idle' \"\r\n (click)=\"onInputFieldClick($event)\">\r\n @if(pretext){\r\n <div class=\"sa-input-pretext\">\r\n {{pretext}}\r\n </div>\r\n }\r\n\r\n <!-- Multi-value chip display -->\r\n @if(isMultiValue) {\r\n <div class=\"chip-container\">\r\n <sa-chip \r\n *ngFor=\"let chip of (chipValues || [])?.slice(startInd,startInd+labelLimit) let i = index\"\r\n [text]=\"chip?.value || chip?.label || chip\"\r\n [type]=\"'regular'\"\r\n [state]=\"'primary'\"\r\n [filling]=\"'filled'\"\r\n [iconPosition]=\"'right'\"\r\n [iconPath]=\"'../assets/closeBlueOutlined.svg'\"\r\n (onClickEvent)=\"removeChip(i)\">\r\n </sa-chip>\r\n \r\n <div (click)=\"shiftLabel('clicked')\" class=\"ng-value overflow-label\"\r\n *ngIf=\"(chipValues || []).length > (startInd + labelLimit)\">\r\n <sa-chip [text]=\"'+' + ((chipValues || []).length - (startInd + labelLimit))\" \r\n type=\"regular\" \r\n state=\"primary\" \r\n filling=\"filled\">\r\n </sa-chip>\r\n </div>\r\n <input\r\n [ngClass]=\"'chip-input'\"\r\n matInput [type]=\"type\"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"chipValues.length === 0 ? (props?.placeholder || params?.placeholder || '') : ''\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onChipBlur()\"\r\n (input)=\"onChipInputChange($event)\"\r\n (keydown)=\"onChipKeyDown($event)\"\r\n [(ngModel)]=\"currentInputValue\"\r\n #formInput />\r\n </div>\r\n } @else {\r\n <!-- Standard single-value input (backward compatibility) -->\r\n @if(!!props?.['prefix']){\r\n <span matPrefix>{{props?.['prefix']}} </span>\r\n }\r\n <input\r\n [ngClass]=\"(!!inputVal && (params?.type === 'password' || props?.type === 'password') && icon.name !== 'eyeOff') ? 'masked' : ''\"\r\n matInput [type]=\"props?.type || type\" value=\"\" [pattern]=\"type==='tel' ? '[0-9]' : '' \"\r\n [disabled]=\"field.props.disabled || false\"\r\n [placeholder]=\"!pretext && props?.placeholder || params?.placeholder || ''\" (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\" (input)=\"onInput($event)\" [(ngModel)]=\"inputVal\" #formInput />\r\n }\r\n\r\n @if(params?.type === 'password'){\r\n <sa-icon class=\"flex\" icon=\"eyeOutlined\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"!icon.name || icon.name === 'eyeOutlined' ? '' : 'hide'\"></sa-icon>\r\n <sa-icon class=\"flex\" icon=\"eyeOff\" [size]=\"icon.size || '24'\" (click)=\"inputIconClick()\"\r\n [ngClass]=\"icon.name === 'eyeOff' ? '' : 'hide'\"></sa-icon>\r\n }@else if(params?.type === 'email' && icon.show){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name || 'checkCircleOutlined'\" [size]=\"icon.size || '24'\"\r\n (click)=\"inputIconClick()\" [ngClass]=\"showEmailIcon ? '' : 'hide'\"></sa-icon>\r\n }\r\n @else if(icon?.name){\r\n <sa-icon class=\"flex\" [icon]=\"icon.name\" [size]=\"icon?.size || '24'\" [color]=\"icon?.color || ''\"\r\n [ngClass]=\"icon?.show ? '' : 'hide'\"></sa-icon>\r\n }\r\n </div>\r\n @if((!formControl.valid) || (params?.supportText)){\r\n <div class=\"support-label {{formControl.invalid && formControl.touched ? params?.className : ''}}\" [ngClass]=\"[\r\n formControl.invalid && formControl.touched ? 'invalid' : 'idle'\r\n ]\">\r\n <!-- {{!formControl.valid ? inputErrorText : params.supportText}} -->\r\n {{getFormSupportText()}}\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: ["*{--error-red: #e25c61 }.idle{--border: 1px solid var(--grey-50)}.focus{--border: 1px solid var(--primary-300)}.masked{font-size:28px;font-weight:500;padding-top:4px}.disabled .sa-input-field,[disabled]{background-color:#fafafa;cursor:not-allowed}.disabled .sa-input-field input{color:#989da3}.sa-input-field>input,.sa-input-field>input:focus-visible{--border: 1px solid var(--primary-300);border:none;outline:none}.sa-input-field:hover{--border: 1px solid var(--primary-300);--font-color: var(--text-highemphasis)}.sa-input-field sa-icon{color:var(--icon-grey1)}.sa-input-field>input:focus-visible~sa-icon,.sa-input-field:hover sa-icon{color:var(--primary-300)}.sa-input-field.invalid>input,.sa-input-field.invalid sa-icon,.sa-input-field.invalid .sa-input-pretext{color:var(--semantic-error-500, #BD271E)}.sa-input-field.invalid{--border: 1px solid var(--semantic-error-500, #BD271E)}.sa-input-field.invalid sa-icon{--form-email-icon-color: var(--semantic-error-500, #BD271E)}.sa-input-field.idle sa-icon{--form-email-icon-color: #33961F}.sa-input{position:relative;padding:8px 0}.sa-input input:-webkit-autofill,.sa-input input:-webkit-autofill:hover,.sa-input input:-webkit-autofill:focus,.sa-input input:-internal-autofill-selected{background-clip:text;-webkit-background-clip:text}.sa-input .sa-input-field input{background-clip:text;-webkit-background-clip:text;font-weight:unset}.sa-input-pretext{margin-right:2px}.sa-input-field{width:100%;box-sizing:border-box;position:relative;display:inline-flex;padding:0px var(--small-12px);height:40px;justify-content:center;align-items:center;border:var(--border);border-radius:var(--small-4px);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.25px;--font-color: var(--text-lowemphasis)}.sa-input-field input{width:inherit}.sa-input-tag{position:absolute;background:#fff;padding:2px 6px;top:-1px;left:12px;z-index:2;font-size:11px;font-weight:500;line-height:16px;letter-spacing:.5px;text-align:left;color:var(--text-lowemphasis)}.support-label{font-family:var(--font);font-size:11px;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.5px;color:var(--text-lowemphasis);padding:var(--small-4px) var(--small-16px) 0px var(--small-16px)}.support-label.invalid{color:var(--error-red)}.hide{display:none}.sa-input-big-label-container,.sa-input-label-container{display:flex;flex-direction:column;gap:var(--small-8px, 8px)}.sa-input-big-label{color:var(--text-highemphasis, #1C1B20);font-family:var(--font-roboto, Roboto);font-size:var(--medium-22px, 22px);font-style:normal;font-weight:500;line-height:var(--medium-28px, 28px);margin:0}.sa-input-big-description,.sa-input-description{color:var(--text-mediumemphasis, #6D6979);font-family:var(--font-roboto, Roboto);font-size:var(--small-14px, 14px);font-style:normal;font-weight:400;line-height:var(--medium-20px, 20px);letter-spacing:.25px;margin:0}.sa-input-container{display:flex;flex-direction:column;gap:var(--medium-20px, 20px)}.sa-input-label{color:var(--text-highemphasis, #1B1D20);font-family:var(--font);font-size:var(--small-14px);font-style:normal;font-weight:500;line-height:var(--medium-20px);letter-spacing:.1px}.sa-input-label-tooltip-container{display:flex;gap:var(--small-4px);align-items:center}.d-flex{display:flex}.chip-container{display:flex;flex-wrap:wrap;align-items:center;gap:4px;width:100%;min-height:20px}.chip-input{border:none;outline:none;background:transparent;flex:1;min-width:60px;font-size:14px;font-family:inherit;color:inherit}.chip-input::placeholder{color:var(--text-medium-emphasis, #6D6979)}.chip-container sa-chip{margin:2px 0}@media screen and (max-width: 1024px){.masked{font-weight:unset}}\n"] }]
|
|
2326
2326
|
}], ctorParameters: () => [], propDecorators: { formInput: [{
|
|
2327
2327
|
type: ViewChild,
|
|
2328
2328
|
args: ['formInput']
|
|
@@ -3601,7 +3601,6 @@ class DropdownMenuComponent extends FieldType {
|
|
|
3601
3601
|
this.formControl.setValue(item.value);
|
|
3602
3602
|
this.formControl.markAsTouched();
|
|
3603
3603
|
this.menuTrigger.closeMenu();
|
|
3604
|
-
console.log(updatedValue);
|
|
3605
3604
|
}
|
|
3606
3605
|
get showError() {
|
|
3607
3606
|
return this.formControl?.invalid && this.formControl?.touched;
|
|
@@ -3620,8 +3619,8 @@ class DropdownMenuComponent extends FieldType {
|
|
|
3620
3619
|
return;
|
|
3621
3620
|
this.selectedDate = date;
|
|
3622
3621
|
const formatted = date.toLocaleDateString('en-US', {
|
|
3623
|
-
month: '2-digit',
|
|
3624
3622
|
day: '2-digit',
|
|
3623
|
+
month: '2-digit',
|
|
3625
3624
|
year: 'numeric',
|
|
3626
3625
|
});
|
|
3627
3626
|
const updatedValue = {
|
|
@@ -3631,7 +3630,6 @@ class DropdownMenuComponent extends FieldType {
|
|
|
3631
3630
|
this.formControl.setValue(formatted);
|
|
3632
3631
|
this.formControl.markAsTouched();
|
|
3633
3632
|
this.menuTrigger.closeMenu();
|
|
3634
|
-
console.log(updatedValue);
|
|
3635
3633
|
}
|
|
3636
3634
|
stopCalendarClose(event) {
|
|
3637
3635
|
event.stopPropagation();
|