diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/number-input/number-properties/number-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/number-input/number-properties/number-properties.component.html index 770f4bbb2..429e559e9 100644 --- a/projects/dxc-ngx-cdk-site/src/app/components/examples/number-input/number-properties/number-properties.component.html +++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/number-input/number-properties/number-properties.component.html @@ -18,6 +18,11 @@ uncontrolled and the value will be managed internally by the component. + + defaultValue: string + + Initial value of the number input, only when it is uncontrolled. + label: string diff --git a/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/text-input-preview/text-input-preview.component.html b/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/text-input-preview/text-input-preview.component.html index 556a9b42b..bc4d756a8 100644 --- a/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/text-input-preview/text-input-preview.component.html +++ b/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/text-input-preview/text-input-preview.component.html @@ -240,6 +240,7 @@ helperText="Helper text" placeholder="placeholder" margin="xsmall" + defaultValue="12" > diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.html b/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.html index 7605b6c95..d03ec6915 100644 --- a/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.html +++ b/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.html @@ -13,6 +13,7 @@ [disabled]="disabled" [optional]="optional" [autocomplete]="autocomplete" + [defaultValue]="defaultValue" > { expect(screen.queryByText("helper-text")).toBeInTheDocument(); }); + test("should render defaultValue", async () => { + await render(DxcNumberInputComponent, { + componentProperties: { + label: "test-input", + helperText: "helper-text", + defaultValue: "4", + }, + imports: [DxcTextInputModule], + }); + + expect(screen.queryByText("test-input")).toBeInTheDocument(); + expect(screen.queryByText("helper-text")).toBeInTheDocument(); + expect(screen.getByDisplayValue("4")).toBeTruthy(); + }); + test("should render error dxc-number", async () => { await render(DxcNumberInputComponent, { componentProperties: { diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.ts index 4892f29eb..ec4571e8a 100644 --- a/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.ts +++ b/projects/dxc-ngx-cdk/src/lib/dxc-number-input/dxc-number-input.component.ts @@ -55,6 +55,10 @@ export class DxcNumberInputComponent implements OnInit, OnChanges, OnDestroy { * Value of the input element. If undefined, the component will be uncontrolled and the value will be managed internally by the component. */ @Input() value: string; + /** + * Initial value of the number input, only when it is uncontrolled. + */ + @Input() defaultValue: string; /** * Helper text to be placed above the number. */ @@ -227,7 +231,7 @@ export class DxcNumberInputComponent implements OnInit, OnChanges, OnDestroy { this.randomId = `input-${Math.floor(Math.random() * 1000000000000000) + 1}`; if (this.value === undefined) { - this.value = ""; + this.value = this.defaultValue ?? ""; this.controlled = false; } else { this.controlled = true; diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-password-input/dxc-password-input.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-password-input/dxc-password-input.component.ts index 571239c2d..eef9d3f5e 100644 --- a/projects/dxc-ngx-cdk/src/lib/dxc-password-input/dxc-password-input.component.ts +++ b/projects/dxc-ngx-cdk/src/lib/dxc-password-input/dxc-password-input.component.ts @@ -110,7 +110,7 @@ export class DxcPasswordInputComponent implements OnInit, OnChanges { this.type = "password"; if (this.value === undefined) { - this.defaultValue ? (this.value = this.defaultValue) : (this.value = ""); + this.value = this.defaultValue ?? ""; this.controlled = false; } else { this.controlled = true;