docs(Space): refactor jsx properties to tsx (#2216)

dnbexperience · May 31, 2023 · 73ef72e · 73ef72e
1 parent 036834d
commit 73ef72e
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 10 deletions.
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/components/space/Examples.tsx b/packages/dnb-design-system-portal/src/docs/uilib/components/space/Examples.tsx
@@ -8,6 +8,7 @@ import PropTypes from 'prop-types'
 import ComponentBox from '../../../../shared/tags/ComponentBox'
 import styled from '@emotion/styled'
 import { Space, Input, FormRow, Button, P, Code } from '@dnb/eufemia/src'
+import { Provider } from '@dnb/eufemia/src/shared'
 
 export const SpaceExamplesMethod1 = () => (
   <TestStyles>
@@ -483,3 +484,12 @@ export const SpaceExamplesFourDirections = () => (
     <Button space="large x-small medium" />
   </ComponentBox>
 )
+
+export const SpaceExampleProvider = () => (
+  <ComponentBox scope={{ Provider }} hidePreview>
+    <Provider space={{ no_collapse: true }}>
+      <Space>I do not collapse</Space>
+      <Space>I do not collapse</Space>
+    </Provider>
+  </ComponentBox>
+)
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/components/space/properties.mdx b/packages/dnb-design-system-portal/src/docs/uilib/components/space/properties.mdx
@@ -2,6 +2,8 @@
 showTabs: true
 ---
 
+import { SpaceExampleProvider } from 'Docs/uilib/components/space/Examples'
+
 ## Global Properties
 
 These properties are available in many other components and elements.
@@ -31,13 +33,4 @@ Use either `0` or `false` (as a number/boolean os string) to set a `margin` of 0
 
 Also, Provider is supporting the `collapse` property.
 
-```jsx
-import Provider from '@dnb/eufemia/shared/Provider'
-
-render(
-  <Provider space={{ no_collapse: true }}>
-    <Space>I do not collapse</Space>
-    <Space>I do not collapse</Space>
-  </Provider>
-)
-```
+<SpaceExampleProvider />