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 f1086541971..1988e8b5d65 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 @@ -1,5 +1,9 @@ +import { OmitTableProperties } from 'dnb-design-system-portal/src/shared/tags/Table' + ### Standard data value component props + + | Property | Type | Description | | ---------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | `className` | `string` | _(optional)_ Outer DOM element class name. | @@ -27,3 +31,10 @@ | `onBlurValidator` | `function` | _(optional)_ Custom validator function that will be called when the user leaves the field (blurring a text input, closing a dropdown etc). Can be asynchronous or synchronous. | | `toInput` | `function` | _(optional)_ Derivate called when the received / active value is sent to the input. Can be used for casting, changing syntax etc. | | `fromInput` | `function` | _(optional)_ Derivate called when changes is made by the user, to cast or change syntax back to the original (opposite of `toInput`). | + + + +export default function Layout({ omit = null, children }) { + globalThis.omitTableProperties = omit + return <>{children} +} 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 1da36ba7fb9..a9106f2ad91 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 @@ -6,7 +6,16 @@ import DataValueReadwriteProperties from '../../data-value-readwrite-properties. ## Properties - + ### Component-specific props diff --git a/packages/dnb-design-system-portal/src/shared/tags/Table.tsx b/packages/dnb-design-system-portal/src/shared/tags/Table.tsx index fff5588d983..f375885c738 100644 --- a/packages/dnb-design-system-portal/src/shared/tags/Table.tsx +++ b/packages/dnb-design-system-portal/src/shared/tags/Table.tsx @@ -14,6 +14,27 @@ const StyledTable = styled(TableElement)` } ` +export function OmitTableProperties({ children, ...rest }) { + const omitProperties = globalThis.omitTableProperties || [] + + return recursiveMap(children, (child: React.ReactElement) => { + if (child.type === 'tr') { + const firstTd = getFirstChild(child) + + if (firstTd.type === 'td') { + const tdContent = getFirstChild(firstTd) + const name = getFirstChild(tdContent) + + if (omitProperties.includes(name)) { + return null + } + } + } + + return child + }) +} + export default function Table({ children }) { // make sure we get the table children children = @@ -56,6 +77,10 @@ export default function Table({ children }) { ) } +function getFirstChild(children: ChildrenWithChildren) { + return children.props.children.at(0) +} + function getChildren(children: ChildrenWithChildren) { return recursiveMap(children.props.children, (child) => child) }