diff --git a/packages/dnb-design-system-portal/src/docs/uilib/components/upload/Examples.tsx b/packages/dnb-design-system-portal/src/docs/uilib/components/upload/Examples.tsx
index 38c4ad85981..0af781bad7a 100644
--- a/packages/dnb-design-system-portal/src/docs/uilib/components/upload/Examples.tsx
+++ b/packages/dnb-design-system-portal/src/docs/uilib/components/upload/Examples.tsx
@@ -312,3 +312,14 @@ export const UploadDisabledFileMaxSize = () => (
/>
)
+
+export const UploadNoTitleNoText = () => (
+
+
+
+)
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/components/upload/demos.mdx b/packages/dnb-design-system-portal/src/docs/uilib/components/upload/demos.mdx
index 2d85d0cadfa..62b9d326202 100644
--- a/packages/dnb-design-system-portal/src/docs/uilib/components/upload/demos.mdx
+++ b/packages/dnb-design-system-portal/src/docs/uilib/components/upload/demos.mdx
@@ -13,6 +13,7 @@ import {
UploadDisabledFileMaxSize,
UploadFileMaxSizeBasedOnFileType,
UploadFileMaxSizeBasedOnFileTypeDisabled,
+ UploadNoTitleNoText,
} from 'Docs/uilib/components/upload/Examples'
## Demos
@@ -75,3 +76,7 @@ This can also be used to manually implement more complex file max size verificat
+
+### Upload without title and text
+
+
diff --git a/packages/dnb-eufemia/src/components/upload/UploadDocs.ts b/packages/dnb-eufemia/src/components/upload/UploadDocs.ts
index e094e1e2a2f..46749aebc69 100644
--- a/packages/dnb-eufemia/src/components/upload/UploadDocs.ts
+++ b/packages/dnb-eufemia/src/components/upload/UploadDocs.ts
@@ -17,12 +17,12 @@ export const UploadProperties: PropertiesTableProps = {
status: 'optional',
},
title: {
- doc: 'Custom text property. Replaces the default title.',
+ doc: 'Custom text property. Replaces the default title. Can be disabled using `false`.',
type: 'string',
status: 'optional',
},
text: {
- doc: 'Custom text property. Replaces the default text.',
+ doc: 'Custom text property. Replaces the default text. Can be disabled using `false`.',
type: 'string',
status: 'optional',
},
diff --git a/packages/dnb-eufemia/src/components/upload/UploadInfo.tsx b/packages/dnb-eufemia/src/components/upload/UploadInfo.tsx
index 41761147856..6f8f76d5fed 100644
--- a/packages/dnb-eufemia/src/components/upload/UploadInfo.tsx
+++ b/packages/dnb-eufemia/src/components/upload/UploadInfo.tsx
@@ -58,11 +58,13 @@ const UploadInfo = () => {
return (
<>
- {title}
+ {title && {title}}
-
- {text}
-
+ {text && (
+
+ {text}
+
+ )}
{children}
diff --git a/packages/dnb-eufemia/src/components/upload/__tests__/Upload.screenshot.test.ts b/packages/dnb-eufemia/src/components/upload/__tests__/Upload.screenshot.test.ts
index 181a9489042..256ede9c8d6 100644
--- a/packages/dnb-eufemia/src/components/upload/__tests__/Upload.screenshot.test.ts
+++ b/packages/dnb-eufemia/src/components/upload/__tests__/Upload.screenshot.test.ts
@@ -42,6 +42,13 @@ describe.each(['ui', 'sbanken'])('Upload for %s', (themeName) => {
})
expect(screenshot).toMatchImageSnapshot()
})
+
+ it('have to match when not providing title and text', async () => {
+ const screenshot = await makeScreenshot({
+ selector: '[data-visual-test="upload-no-title-no-text"]',
+ })
+ expect(screenshot).toMatchImageSnapshot()
+ })
})
describe('Upload', () => {
diff --git a/packages/dnb-eufemia/src/components/upload/__tests__/Upload.test.tsx b/packages/dnb-eufemia/src/components/upload/__tests__/Upload.test.tsx
index eef3f212aa0..2cb5e8050e8 100644
--- a/packages/dnb-eufemia/src/components/upload/__tests__/Upload.test.tsx
+++ b/packages/dnb-eufemia/src/components/upload/__tests__/Upload.test.tsx
@@ -96,6 +96,30 @@ describe('Upload', () => {
).toBeInTheDocument()
})
+ it('does not render text when text is false', () => {
+ render()
+
+ expect(screen.queryByText(nb.text)).not.toBeInTheDocument()
+ })
+
+ it('does not render text when text is empty string', () => {
+ render()
+
+ expect(screen.queryByText(nb.text)).not.toBeInTheDocument()
+ })
+
+ it('does not render title when title is false', () => {
+ render()
+
+ expect(screen.queryByText(nb.title)).not.toBeInTheDocument()
+ })
+
+ it('does not render title when title is empty string', () => {
+ render()
+
+ expect(screen.queryByText(nb.title)).not.toBeInTheDocument()
+ })
+
it('does not render fileTypeDescription when acceptedFileTypes is empty', () => {
const acceptedFileTypes = []
diff --git a/packages/dnb-eufemia/src/components/upload/__tests__/__image_snapshots__/upload-for-sbanken-have-to-match-when-not-providing-title-and-text.snap.png b/packages/dnb-eufemia/src/components/upload/__tests__/__image_snapshots__/upload-for-sbanken-have-to-match-when-not-providing-title-and-text.snap.png
new file mode 100644
index 00000000000..b5a409f0537
Binary files /dev/null and b/packages/dnb-eufemia/src/components/upload/__tests__/__image_snapshots__/upload-for-sbanken-have-to-match-when-not-providing-title-and-text.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/upload/__tests__/__image_snapshots__/upload-for-ui-have-to-match-when-not-providing-title-and-text.snap.png b/packages/dnb-eufemia/src/components/upload/__tests__/__image_snapshots__/upload-for-ui-have-to-match-when-not-providing-title-and-text.snap.png
new file mode 100644
index 00000000000..3f9dd022ce9
Binary files /dev/null and b/packages/dnb-eufemia/src/components/upload/__tests__/__image_snapshots__/upload-for-ui-have-to-match-when-not-providing-title-and-text.snap.png differ