diff --git a/packages/dnb-design-system-portal/src/docs/uilib/elements/lists/demos.mdx b/packages/dnb-design-system-portal/src/docs/uilib/elements/lists/demos.mdx index e5051b4d523..b0d66b6829a 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/elements/lists/demos.mdx +++ b/packages/dnb-design-system-portal/src/docs/uilib/elements/lists/demos.mdx @@ -11,6 +11,7 @@ import { OrderedListStylePositionExample, OrderedListOtherTypesExample, RemoveListExample, + DefinitionListHorizontalExampleWithoutDtValue, } from 'Docs/uilib/elements/lists/Examples' ## Demos diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/Examples.tsx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/Examples.tsx index 93f658babe3..01f56c1b4f2 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/Examples.tsx +++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/Examples.tsx @@ -147,3 +147,13 @@ export function InheritLabel() { ) } + +export const HorizontalLayoutWithoutLabel = () => ( + + + + + + + +) diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/demos.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/demos.mdx index b1c891bb857..7b8b89f87f8 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/demos.mdx +++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/demos.mdx @@ -31,3 +31,7 @@ Using [Value.Composition](/uilib/extensions/forms/Value/Composition/) to combine ### Inherit label + + + + diff --git a/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.screenshot.test.ts b/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.screenshot.test.ts index 6a2d12fec10..da49e002d27 100644 --- a/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.screenshot.test.ts +++ b/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.screenshot.test.ts @@ -35,4 +35,13 @@ describe('Field.SummaryList', () => { }) expect(screenshot).toMatchImageSnapshot() }) + + it('have to match without a label', async () => { + const screenshot = await makeScreenshot({ + style: { width: '6rem' }, + selector: + '[data-visual-test="forms-value-summary-horizontal-empty-label"] ', + }) + expect(screenshot).toMatchImageSnapshot() + }) }) diff --git a/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.test.tsx b/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.test.tsx index 02e96825441..e467122dc7f 100644 --- a/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.test.tsx +++ b/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/SummaryList.test.tsx @@ -17,6 +17,15 @@ describe('Field.SummaryList', () => { expect(element.getAttribute('aria-label')).toBe('Aria Label') }) + it('should have dnb-sr-only class when no label is given', () => { + render( + + + + ) + expect(document.querySelector('dt')).toHaveClass('dnb-sr-only') + }) + it('should warn when child is not a Value.* component', () => { const log = jest.spyOn(console, 'log').mockImplementation() diff --git a/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/__image_snapshots__/fieldsummarylist-have-to-match-without-a-label.snap.png b/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/__image_snapshots__/fieldsummarylist-have-to-match-without-a-label.snap.png new file mode 100644 index 00000000000..06fcd7b3253 Binary files /dev/null and b/packages/dnb-eufemia/src/extensions/forms/Value/SummaryList/__tests__/__image_snapshots__/fieldsummarylist-have-to-match-without-a-label.snap.png differ diff --git a/packages/dnb-eufemia/src/extensions/forms/ValueBlock/ValueBlock.tsx b/packages/dnb-eufemia/src/extensions/forms/ValueBlock/ValueBlock.tsx index b057b0f58aa..b6e7d4b8e0b 100644 --- a/packages/dnb-eufemia/src/extensions/forms/ValueBlock/ValueBlock.tsx +++ b/packages/dnb-eufemia/src/extensions/forms/ValueBlock/ValueBlock.tsx @@ -116,7 +116,12 @@ function ValueBlock(props: Props) { value={{ ...summaryListContext, isNested: true }} > -
+
{label && {label}}