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;