diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx index efb5de5bc2e..ead9346ae30 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx +++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx @@ -114,6 +114,16 @@ export const Widths = () => { ) } +export const WithDescription = () => { + return ( + + + Input features goes here + + + ) +} + export const GroupMultipleFields = () => { return ( diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/demos.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/demos.mdx index 15f4ae4de39..4b6806a06d8 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/demos.mdx +++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/demos.mdx @@ -26,6 +26,10 @@ import * as Examples from './Examples' +### With description (vertical only) + + + ### Group multiple fields diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/data-value-readwrite-properties.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/data-value-readwrite-properties.mdx index 1aeea8965a5..8a26271fbfb 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/data-value-readwrite-properties.mdx +++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/data-value-readwrite-properties.mdx @@ -12,6 +12,7 @@ import { OmitTableProperties } from 'dnb-design-system-portal/src/shared/tags/Ta | `name` | `string` | _(optional)_ Outer DOM element name attribute. | | `layout` | `string` | _(optional)_ Layout for the label and input. Can be `horizontal` or `vertical`. | | `label` | `string` | _(optional)_ Field label to show above / before the input feature. | +| `labelDescription` | `string` | _(optional)_ A more discreet text displayed beside the label (i.e for "(optional)"). | | `placeholder` | `string` | _(optional)_ Text showing in place of the value if no value is given. | | `path` | `string` | _(optional)_ JSON Pointer for where the data for this input is located in the source dataset (when using Form.Handler or DataContext). The `path` will also be set as the `name` attribute for the [string](/uilib/extensions/forms/base-fields/String/)-field. | | `info` | `Error` or `string` | _(optional)_ Info message shown below / after the input. | diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/feature-fields/PhoneNumber/properties.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/feature-fields/PhoneNumber/properties.mdx index 6b58a21f93a..5f8f409b9f0 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/feature-fields/PhoneNumber/properties.mdx +++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/feature-fields/PhoneNumber/properties.mdx @@ -22,4 +22,7 @@ import DataValueReadwriteProperties from '../../data-value-readwrite-properties. | `width` | `string` or `false` | _(optional)_ `large` for predefined standard width, `stretch` for fill available width. | | [Space](/uilib/layout/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. | - + diff --git a/packages/dnb-eufemia/src/components/textarea/Textarea.js b/packages/dnb-eufemia/src/components/textarea/Textarea.js index bb6971138cd..c48b0b1acdd 100644 --- a/packages/dnb-eufemia/src/components/textarea/Textarea.js +++ b/packages/dnb-eufemia/src/components/textarea/Textarea.js @@ -549,7 +549,7 @@ export default class Textarea extends React.PureComponent { {characterCounter && maxLength > 0 && ( { const textarea = document.querySelector('textarea') const ariaLive = document.querySelector('.dnb-aria-live') - expect(counter).toHaveTextContent('5 av 8 tegn gjenstår') + expect(counter).toHaveTextContent('3 av 8 tegn gjenstår') expect(ariaLive).toHaveTextContent('') await userEvent.type(textarea, 'bar') - expect(counter).toHaveTextContent('2 av 8 tegn gjenstår') - expect(ariaLive).toHaveTextContent('2 av 8 tegn gjenstår') + expect(counter).toHaveTextContent('6 av 8 tegn gjenstår') + expect(ariaLive).toHaveTextContent('6 av 8 tegn gjenstår') rerender(