make wizard expandable

dnbexperience · Aug 20, 2024 · abc6b3f · abc6b3f
1 parent f280df6
commit abc6b3f
Show file tree

Hide file tree

Showing 23 changed files with 24 additions and 34 deletions.
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard.mdx
@@ -17,6 +17,7 @@ breadcrumb:
     href: /uilib/extensions/forms/
   - text: Wizard
     href: /uilib/extensions/forms/Wizard/
+expanded: false
 ---
 
 import Info from 'Docs/uilib/extensions/forms/Wizard/info'

diff --git a/...ges/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Buttons.mdx b/...ges/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Buttons.mdx
@@ -1,8 +1,7 @@
 ---
 title: 'Buttons'
 description: '`Wizard.Buttons` is a combination of PreviousButton and NextButton for navigating between steps/pages.'
-order: 10
-hideInMenu: true
+order: 30
 showTabs: true
 tabs:
   - title: Info

diff --git a/...nb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Buttons/info.mdx b/...nb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Buttons/info.mdx
@@ -4,7 +4,7 @@ showTabs: true
 
 ## Description
 
-`Wizard.Buttons` is a combination of [PreviousButton](/uilib/extensions/forms/Wizard/Buttons/PreviousButton/) and [NextButton](/uilib/extensions/forms/Wizard/Buttons/NextButton/) for navigating between steps/pages.
+`Wizard.Buttons` is a combination of [PreviousButton](/uilib/extensions/forms/Wizard/PreviousButton/) and [NextButton](/uilib/extensions/forms/Wizard/NextButton/) for navigating between steps/pages.
 
 Only the relevant button is shown, depending on the current step.
 

diff --git a/...s/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Container.mdx b/...s/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Container.mdx
@@ -1,8 +1,7 @@
 ---
 title: 'Container'
 description: 'The `Wizard.Container` is a container component for multi-page forms including a step indicator.'
-order: 0
-hideInMenu: true
+order: 10
 showTabs: true
 tabs:
   - title: Info

diff --git a/...tensions/forms/Wizard/Step/EditButton.mdx → ...ib/extensions/forms/Wizard/EditButton.mdx b/...tensions/forms/Wizard/Step/EditButton.mdx → ...ib/extensions/forms/Wizard/EditButton.mdx
@@ -1,17 +1,15 @@
 ---
 title: 'EditButton'
 description: '`Wizard.EditButton` is a button to be placed in a summary step.'
-hideInMenu: true
+order: 40
 showTabs: true
 breadcrumb:
   - text: Forms
     href: /uilib/extensions/forms/
   - text: Wizard
     href: /uilib/extensions/forms/Wizard/
-  - text: Step
-    href: /uilib/extensions/forms/Wizard/Step/
   - text: EditButton
-    href: /uilib/extensions/forms/Wizard/Step/EditButton/
+    href: /uilib/extensions/forms/Wizard/EditButton/
 tabs:
   - title: Info
     key: '/info'
@@ -21,8 +19,8 @@ tabs:
     key: '/properties'
 ---
 
-import Info from 'Docs/uilib/extensions/forms/Wizard/Step/EditButton/info'
-import Demos from 'Docs/uilib/extensions/forms/Wizard/Step/EditButton/demos'
+import Info from 'Docs/uilib/extensions/forms/Wizard/EditButton/info'
+import Demos from 'Docs/uilib/extensions/forms/Wizard/EditButton/demos'
 
 <Info />
 <Demos />
diff --git a/...ns/forms/Wizard/Step/EditButton/demos.mdx → ...ensions/forms/Wizard/EditButton/demos.mdx b/...ns/forms/Wizard/Step/EditButton/demos.mdx → ...ensions/forms/Wizard/EditButton/demos.mdx
@@ -2,7 +2,7 @@
 showTabs: true
 ---
 
-import * as Examples from './../Examples'
+import * as Examples from '../Step/Examples'
 
 ## Demo
 

diff --git a/...ons/forms/Wizard/Step/EditButton/info.mdx → ...tensions/forms/Wizard/EditButton/info.mdx b/...ons/forms/Wizard/Step/EditButton/info.mdx → ...tensions/forms/Wizard/EditButton/info.mdx
diff --git a/...rms/Wizard/Step/EditButton/properties.mdx → ...ns/forms/Wizard/EditButton/properties.mdx b/...rms/Wizard/Step/EditButton/properties.mdx → ...ns/forms/Wizard/EditButton/properties.mdx
diff --git a/...sions/forms/Wizard/Buttons/NextButton.mdx → ...ib/extensions/forms/Wizard/NextButton.mdx b/...sions/forms/Wizard/Buttons/NextButton.mdx → ...ib/extensions/forms/Wizard/NextButton.mdx
@@ -1,17 +1,15 @@
 ---
 title: 'NextButton'
 description: '`Wizard.NextButton` connects to the `Wizard.Context` to move the user to the next step when clicked.'
-hideInMenu: true
+order: 50
 showTabs: true
 breadcrumb:
   - text: Forms
     href: /uilib/extensions/forms/
   - text: Wizard
     href: /uilib/extensions/forms/Wizard/
-  - text: Buttons
-    href: /uilib/extensions/forms/Wizard/Buttons/
   - text: NextButton
-    href: /uilib/extensions/forms/Wizard/Buttons/NextButton/
+    href: /uilib/extensions/forms/Wizard/NextButton/
 tabs:
   - title: Info
     key: '/info'
@@ -21,8 +19,8 @@ tabs:
     key: '/properties'
 ---
 
-import Info from 'Docs/uilib/extensions/forms/Wizard/Buttons/NextButton/info'
-import Demos from 'Docs/uilib/extensions/forms/Wizard/Buttons/NextButton/demos'
+import Info from 'Docs/uilib/extensions/forms/Wizard/NextButton/info'
+import Demos from 'Docs/uilib/extensions/forms/Wizard/NextButton/demos'
 
 <Info />
 <Demos />
diff --git a/...ms/Wizard/Buttons/NextButton/Examples.tsx → ...ions/forms/Wizard/NextButton/Examples.tsx b/...ms/Wizard/Buttons/NextButton/Examples.tsx → ...ions/forms/Wizard/NextButton/Examples.tsx
@@ -1,4 +1,4 @@
-import ComponentBox from '../../../../../../../shared/tags/ComponentBox'
+import ComponentBox from '../../../../../../shared/tags/ComponentBox'
 import { Wizard } from '@dnb/eufemia/src/extensions/forms'
 
 export const Default = () => {

diff --git a/...forms/Wizard/Buttons/NextButton/demos.mdx → ...ensions/forms/Wizard/NextButton/demos.mdx b/...forms/Wizard/Buttons/NextButton/demos.mdx → ...ensions/forms/Wizard/NextButton/demos.mdx
diff --git a/.../forms/Wizard/Buttons/NextButton/info.mdx → ...tensions/forms/Wizard/NextButton/info.mdx b/.../forms/Wizard/Buttons/NextButton/info.mdx → ...tensions/forms/Wizard/NextButton/info.mdx
diff --git a/.../Wizard/Buttons/NextButton/properties.mdx → ...ns/forms/Wizard/NextButton/properties.mdx b/.../Wizard/Buttons/NextButton/properties.mdx → ...ns/forms/Wizard/NextButton/properties.mdx
diff --git a/...s/forms/Wizard/Buttons/PreviousButton.mdx → ...xtensions/forms/Wizard/PreviousButton.mdx b/...s/forms/Wizard/Buttons/PreviousButton.mdx → ...xtensions/forms/Wizard/PreviousButton.mdx
@@ -1,17 +1,15 @@
 ---
 title: 'PreviousButton'
 description: '`Wizard.PreviousButton` connects to the `Wizard.Context` to move the user to the previous step when clicked.'
-hideInMenu: true
+order: 60
 showTabs: true
 breadcrumb:
   - text: Forms
     href: /uilib/extensions/forms/
   - text: Wizard
     href: /uilib/extensions/forms/Wizard/
-  - text: Buttons
-    href: /uilib/extensions/forms/Wizard/Buttons/
   - text: PreviousButton
-    href: /uilib/extensions/forms/Wizard/Buttons/PreviousButton/
+    href: /uilib/extensions/forms/Wizard/PreviousButton/
 tabs:
   - title: Info
     key: '/info'
@@ -21,8 +19,8 @@ tabs:
     key: '/properties'
 ---
 
-import Info from 'Docs/uilib/extensions/forms/Wizard/Buttons/PreviousButton/info'
-import Demos from 'Docs/uilib/extensions/forms/Wizard/Buttons/PreviousButton/demos'
+import Info from 'Docs/uilib/extensions/forms/Wizard/PreviousButton/info'
+import Demos from 'Docs/uilib/extensions/forms/Wizard/PreviousButton/demos'
 
 <Info />
 <Demos />
diff --git a/...izard/Buttons/PreviousButton/Examples.tsx → .../forms/Wizard/PreviousButton/Examples.tsx b/...izard/Buttons/PreviousButton/Examples.tsx → .../forms/Wizard/PreviousButton/Examples.tsx
@@ -1,4 +1,4 @@
-import ComponentBox from '../../../../../../../shared/tags/ComponentBox'
+import ComponentBox from '../../../../../../shared/tags/ComponentBox'
 import { Wizard } from '@dnb/eufemia/src/extensions/forms'
 
 export const Default = () => {

diff --git a/...s/Wizard/Buttons/PreviousButton/demos.mdx → ...ons/forms/Wizard/PreviousButton/demos.mdx b/...s/Wizard/Buttons/PreviousButton/demos.mdx → ...ons/forms/Wizard/PreviousButton/demos.mdx
diff --git a/...ms/Wizard/Buttons/PreviousButton/info.mdx → ...ions/forms/Wizard/PreviousButton/info.mdx b/...ms/Wizard/Buttons/PreviousButton/info.mdx → ...ions/forms/Wizard/PreviousButton/info.mdx
diff --git a/...ard/Buttons/PreviousButton/properties.mdx → ...orms/Wizard/PreviousButton/properties.mdx b/...ard/Buttons/PreviousButton/properties.mdx → ...orms/Wizard/PreviousButton/properties.mdx
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Step.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Step.mdx
@@ -1,8 +1,7 @@
 ---
 title: 'Step'
 description: 'Each step should be wrapped with a `Wizard.Step` component directly inside Wizard.Container.'
-order: 1
-hideInMenu: true
+order: 20
 showTabs: true
 tabs:
   - title: Info

diff --git a/...s/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Step/info.mdx b/...s/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/Step/info.mdx
@@ -40,4 +40,4 @@ It uses [Flex.Stack](/uilib/layout/flex/stack/) so you don't need to wrap your c
 
 ## EditButton
 
-In order to navigate back to another step, you can use the [EditButton](/uilib/extensions/forms/Wizard/Step/EditButton/) component.
+In order to navigate back to another step, you can use the [EditButton](/uilib/extensions/forms/Wizard/EditButton/) component.
diff --git a/...-design-system-portal/src/docs/uilib/extensions/forms/Wizard/location-hooks.mdx b/...-design-system-portal/src/docs/uilib/extensions/forms/Wizard/location-hooks.mdx
@@ -1,8 +1,7 @@
 ---
 title: 'Location Hooks'
 description: 'Is a set of React Hooks that lets you easily hook up your existing router in order to store the current step in the URL query string.'
-order: 30
-hideInMenu: true
+order: 80
 showTabs: true
 tabs:
   - title: Info

diff --git a/...ges/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/useStep.mdx b/...ges/dnb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/useStep.mdx
@@ -1,8 +1,7 @@
 ---
 title: 'useStep'
 description: '`Wizard.useStep` returns `Wizard.Context` parameters such as totalSteps, activeIndex or a setActiveIndex handler.'
-order: 20
-hideInMenu: true
+order: 70
 showTabs: true
 tabs:
   - title: Info

diff --git a/...nb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/useStep/info.mdx b/...nb-design-system-portal/src/docs/uilib/extensions/forms/Wizard/useStep/info.mdx
@@ -47,4 +47,4 @@ function MyForm() {
 
 ## EditButton
 
-In order to navigate to a new step when using `setActiveIndex` you can use the [EditButton](/uilib/extensions/forms/Wizard/Step/EditButton/) component.
+In order to navigate to a new step when using `setActiveIndex` you can use the [EditButton](/uilib/extensions/forms/Wizard/EditButton/) component.
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,7 +2,7 @@ @@
     showTabs: true
     ---
-    import * as Examples from './../Examples'
+    import * as Examples from '../Step/Examples'
     ## Demo
@@ Expand Down @@
Original file line number	Diff line number	Diff line change
Expand Up		@@ -40,4 +40,4 @@ It uses [Flex.Stack](/uilib/layout/flex/stack/) so you don't need to wrap your c

		## EditButton

		In order to navigate back to another step, you can use the [EditButton](/uilib/extensions/forms/Wizard/Step/EditButton/) component.
		In order to navigate back to another step, you can use the [EditButton](/uilib/extensions/forms/Wizard/EditButton/) component.
Original file line number	Diff line number	Diff line change
Expand Up		@@ -47,4 +47,4 @@ function MyForm() {

		## EditButton

		In order to navigate to a new step when using `setActiveIndex` you can use the [EditButton](/uilib/extensions/forms/Wizard/Step/EditButton/) component.
		In order to navigate to a new step when using `setActiveIndex` you can use the [EditButton](/uilib/extensions/forms/Wizard/EditButton/) component.