diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/file-input/file-input-properties/file-input-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/file-input/file-input-properties/file-input-properties.component.html index 0509e523f..555d2f0ab 100644 --- a/projects/dxc-ngx-cdk-site/src/app/components/examples/file-input/file-input-properties/file-input-properties.component.html +++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/file-input/file-input-properties/file-input-properties.component.html @@ -43,6 +43,15 @@ Helper text to be placed above the component. + + buttonLabel: string + + + + + Text to be placed inside the button. + + accept: string diff --git a/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/file-input-preview/file-input-preview.component.html b/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/file-input-preview/file-input-preview.component.html index e3e5b2c20..8e9418c5c 100644 --- a/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/file-input-preview/file-input-preview.component.html +++ b/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/file-input-preview/file-input-preview.component.html @@ -9,6 +9,15 @@ (callbackFile)="callback($event)" [multiple]="false" > + { expect(fileInput.getByText("Helper Text")); }); + test("should render dxc-file-input with custom buttonLabel", async () => { + const fileInput = await render(DxcFileInputComponent, { + componentProperties: { + label: "Label", + helperText: "Helper Text", + buttonLabel: "Custom Button Label", + }, + excludeComponentDeclaration: true, + imports: [DxcFileInputModule], + }); + + expect(fileInput.getByText("Custom Button Label")); + expect(fileInput.getByText("Label")); + expect(fileInput.getByText("Helper Text")); + }); + + test("should render dxc-file-input in file drop mode", async () => { const fileInput = await render(DxcFileInputComponent, { componentProperties: { diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-file-input/dxc-file-input.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-file-input/dxc-file-input.component.ts index adb64c658..446d8862f 100644 --- a/projects/dxc-ngx-cdk/src/lib/dxc-file-input/dxc-file-input.component.ts +++ b/projects/dxc-ngx-cdk/src/lib/dxc-file-input/dxc-file-input.component.ts @@ -49,6 +49,7 @@ export class DxcFileInputComponent implements OnChanges, OnInit { @Input() public name: string; @Input() public mode: string = "file"; @Input() public label: string; + @Input() public buttonLabel: string; @Input() public helperText: string; @Input() public value: Array; @Input() public accept: any; @@ -148,6 +149,21 @@ export class DxcFileInputComponent implements OnChanges, OnInit { this.hasShowError = this.isErrorShow(); this.hasMultipleFiles = this.isMultipleFilesPrintables(); this.hasSingleFile = this.isSingleFilesPrintables(); + if (!this.buttonLabel) { + console.log( + this.mode === "file" + ? this.multiple + ? "Select files" + : "Select file" + : "Select" + ); + this.buttonLabel = + this.mode === "file" + ? this.multiple + ? "Select files" + : "Select file" + : "Select"; + } this.className = `${this.getDynamicStyle(this.defaultInputs.getValue())}`; }