docs(Portal): add accordion to side menu #3794

snorrekim · 2024-08-06T08:15:35Z

Accordion

Can make a menu item into an accordion with the doc option accordion: true (default is false)
Accordions automatically open and close depending on which page you navigate to.
A "+/-" button indicates the accordions and allows for manual opening and closing.
Fallback auto-scroll after expanding if the item is no longer in view. Because the default auto-scroll can't handle multiple accordions opening and closing at once.

Menu ordering

Added ability to use negative order to add to the bottom (-1 is the the first of them, followed by -2 etc.).
docs without order will be placed in the middle.
fix: docs with order number now at the top instead of the bottom (except negative order)
fix: docs with same title and level no longer ignored
fix: docs with dot . in the file name no longer ignored

New doc structure

"Releases and versions" can now be expanded to see each release page
"Pagination" and "Fragments" children now hidden behind accordion
"Form", "Wizard", "Iterate", "Value", and "Create your own component" can now be expanded to see sub-components
Changed "All feature fields" to accordion "More feature fields..."

Other

"Getting started" table of contents filled out to include all headings
"Releases and versions" now uses <ListSummaryFromEdges> component
<ListSummaryFromEdges>
- component now shows description in returnListItems mode
- fix: <ListSummaryFromEdges> made an <ul>for each <li> in returnListItems mode. Now there is only one <ul> for the entire list.
Side menu is now a hierarchy of nested <ul> instead of one flat list.

Not-implemented ideas for the future

Auto-scroll
- instead of scrolling the item to the top it should be smart enough to include context. Scroll to the parent item, or until the item is centered if the list is too long.
- Should animate the item when finished scrolling (a blink effect maybe?), so the user can easily see where they are
- It should completely control scrolling by stopping all other scrolling at the start of expansion so we don't get the occasional double scroll.
The accordion button interferes with the sbanken styling, this should be improved
The "Usage" sub-menu should probably also implement some accordions
"Base fields" and "Feature fields" could also be accordions, then showing all the children would take less space. today we hide a few, and that's not optimal.

vercel · 2024-08-06T08:15:38Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
eufemia	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 26, 2024 10:36am

codesandbox-ci · 2024-08-06T08:23:46Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

snorrekim · 2024-09-24T09:00:57Z

Features to add:

non cursive description in UL edges. Can we markdown cursive in description? (edit: yes we can)
"All feature fields" should exist as an expandable "more... +/-"

…nded by default

tujoworker

Fantastic improvement 💯 Thank you so much for the hard work 🫶

## Accordion * Can make a menu item into an accordion with the doc option `accordion: true` (default is `false`) * Accordions automatically open and close depending on which page you navigate to. * A "+/-" button indicates the accordions and allows for manual opening and closing. * Fallback auto-scroll _after_ expanding if the item is no longer in view. Because the default auto-scroll can't handle multiple accordions opening and closing at once. ## Menu ordering * Added ability to use negative `order` to add to the bottom (`-1` is the the first of them, followed by `-2` etc.). * docs without order will be placed in the middle. * fix: docs with `order` number now at the top instead of the bottom (except negative order) * fix: docs with same title and level no longer ignored * fix: docs with dot `.` in the file name no longer ignored ## New doc structure * "Releases and versions" can now be expanded to see each release page * "Pagination" and "Fragments" children now hidden behind accordion * "Form", "Wizard", "Iterate", "Value", and "Create your own component" can now be expanded to see sub-components * Changed "All feature fields" to accordion "More feature fields..." ## Other * "Getting started" table of contents filled out to include all headings * "Releases and versions" now uses `<ListSummaryFromEdges>` component * `<ListSummaryFromEdges>` * component now shows description in `returnListItems` mode * fix: `<ListSummaryFromEdges>` made an `<ul>`for each `<li>` in `returnListItems` mode. Now there is only one `<ul>` for the entire list. * Side menu is now a hierarchy of nested `<ul>` instead of one flat list. ## Not-implemented ideas for the future * Auto-scroll * instead of scrolling the item to the top it should be smart enough to include context. Scroll to the parent item, or until the item is centered if the list is too long. * Should animate the item when finished scrolling (a blink effect maybe?), so the user can easily see where they are * It should completely control scrolling by stopping all other scrolling at the start of expansion so we don't get the occasional double scroll. * The accordion button interferes with the sbanken styling, this should be improved * The "Usage" sub-menu should probably also implement some accordions * "Base fields" and "Feature fields" could also be accordions, then showing all the children would take less space. today we hide a few, and that's not optimal.

## [10.51.0](v10.50.0...v10.51.0) (2024-09-30) ### 🐛 Bug Fixes * **Field.Toggle:** removes invisible label when label not provided ([#3984](#3984)) ([c945d5b](c945d5b)) * **Forms:** `Form.useData` should not throw error when used in Wizard ([#4001](#4001)) ([aac721b](aac721b)) * **Forms:** ensure `itemNr` still works in the Iterate.ViewContainer ([#4002](#4002)) ([6f8bfb3](6f8bfb3)) * **Forms:** keep field state during a Wizard step change when used inside Iterate.Array (which used defualtValue as the data source) ([#4025](#4025)) ([595cfd5](595cfd5)) * **Forms:** removes cards max-width in Wizard (StepIndicator) ([#4011](#4011)) ([2bc8812](2bc8812)) * **Tabs:** fix align property with value center ([#3991](#3991)) ([8483df8](8483df8)) ### ✨ Features * **ChildrenWithAge:** display hasChildren value in summary ([#3993](#3993)) ([9ab9de5](9ab9de5)) * **Field.Date:** add date range functionality ([#4006](#4006)) ([12081c3](12081c3)) * **Forms:** add `Form.SubmitConfirmation` to confirm a submit during or before sent ([#4019](#4019)) ([dfce4e4](dfce4e4)) * **Forms:** add `inheritVisibility` to Value.SummaryList ([#4003](#4003)) ([9849516](9849516)) * **Forms:** add inheritLabel to Value.SummaryList ([#4009](#4009)) ([1715a6a](1715a6a)) * **Forms:** add Value.Provider to propagate value props down to Value.* components (e.g. `inheritVisibility`) ([#4005](#4005)) ([c3f10e3](c3f10e3)), closes [#4003](#4003) * **Forms:** deprecate `Form.FieldProps` in favor of `Field.Provider` ([#4020](#4020)) ([d549870](d549870)) * **Forms:** deprecate Form.useError in favor of `Form.useValidation` featuring `setFieldStatus` to handle the status (error) of a single field ([#3986](#3986)) ([dd39eef](dd39eef)) * **Forms:** implement TypeScript version of `json-pointer` ([#4000](#4000)) ([f3caa4b](f3caa4b)) * **NumberFormat:** add `half-even` rounding and deprecated `omit_rounding` in favor of `rounding="omit"` ([#3988](#3988)) ([0c121f1](0c121f1)) * **SASS mixins:** media queries mixins now uses 0.1px instead of 1px to avoid overlap ([#3985](#3985)) ([1cb495a](1cb495a)), closes [media#sect2](https://github.com/dnbexperience/media/issues/sect2) * **Switch:** refactor to typescript ([#3727](#3727)) ([4833c42](4833c42)) ### 📝 Documentation * adds import statement to info doc for layout ([#4018](#4018)) ([0508c4b](0508c4b)) * **Forms:** improves docs for Value.Number & Value.Currency ([#4008](#4008)) ([cc1c365](cc1c365)) * **Portal:** add accordion to side menu ([#3794](#3794)) ([e2604f6](e2604f6)) * prop -> property, and props -> properties ([#3990](#3990)) ([a122fa2](a122fa2)) * **Value.Currency:** improve documented properties ([#4022](#4022)) ([d392901](d392901)), closes [/github.com//pull/4008#discussion_r1776864819](https://github.com/dnbexperience//github.com/dnbexperience/eufemia/pull/4008/issues/discussion_r1776864819)

tujoworker · 2024-09-30T09:58:01Z

🎉 This PR is included in version 10.51.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

vercel bot deployed to Preview August 6, 2024 08:24 View deployment

langz changed the title ~~Chore/portal menu accordion~~ chore(Portal): menu accordion Aug 6, 2024

snorrekim force-pushed the chore/portal-menu-accordion branch from ffcca45 to bdeeead Compare August 8, 2024 12:28

vercel bot deployed to Preview August 8, 2024 12:35 View deployment

vercel bot deployed to Preview August 12, 2024 15:56 View deployment

snorrekim force-pushed the chore/portal-menu-accordion branch from 60edb4d to 14d25f9 Compare August 20, 2024 11:33

vercel bot deployed to Preview August 20, 2024 11:47 View deployment

snorrekim force-pushed the chore/portal-menu-accordion branch from 14d25f9 to abc6b3f Compare August 20, 2024 15:01

vercel bot deployed to Preview August 20, 2024 15:10 View deployment

snorrekim force-pushed the chore/portal-menu-accordion branch from abc6b3f to 812c198 Compare August 21, 2024 10:12

vercel bot deployed to Preview August 21, 2024 10:21 View deployment

vercel bot deployed to Preview August 21, 2024 14:41 View deployment

vercel bot deployed to Preview August 22, 2024 08:19 View deployment

vercel bot deployed to Preview August 26, 2024 17:24 View deployment

snorrekim force-pushed the chore/portal-menu-accordion branch from f78c5bd to 8c43dd1 Compare September 10, 2024 12:20

vercel bot deployed to Preview September 10, 2024 12:30 View deployment

vercel bot deployed to Preview September 16, 2024 14:50 View deployment

vercel bot deployed to Preview September 16, 2024 15:19 View deployment

snorrekim force-pushed the chore/portal-menu-accordion branch from da95416 to fef7302 Compare September 17, 2024 15:48

vercel bot deployed to Preview September 17, 2024 15:55 View deployment

vercel bot deployed to Preview September 17, 2024 17:01 View deployment

langz marked this pull request as ready for review September 19, 2024 10:26

langz requested a review from tujoworker as a code owner September 19, 2024 10:26

snorrekim force-pushed the chore/portal-menu-accordion branch from e4bbe7a to 10881b1 Compare September 23, 2024 14:23

vercel bot deployed to Preview September 23, 2024 14:31 View deployment

snorrekim force-pushed the chore/portal-menu-accordion branch from 10881b1 to 0f52537 Compare September 24, 2024 12:19

vercel bot deployed to Preview September 24, 2024 12:32 View deployment

vercel bot deployed to Preview September 26, 2024 09:37 View deployment

snorrekim added 20 commits September 26, 2024 12:10

menu uses ul elements

ddf6c6e

fix portal tests

fffe470

added accordion option

0520e21

expandsion styling

9377aee

collapse componts

2bfcb3b

cleanup table of contents

5d7ab24

sort ordered docs first, and negative order last

f4a64c5

make wizard expandable

03d75cd

fix portal tests

052d46a

fix order when docs have same level and name

3e6b8df

Value and Iterate now expands, removed duplicate list of feature fields

a3ece32

create component expandable

1b1cf97

use HeightAnimation, ensure item is scrolled to

6191997

fix list summary ul per li

3490d6e

add decription to ul list summary

911cc87

fix docs with . in file name being assigned the wrong parent

55f98b1

releases expands to a list of version docs

040b036

doc option 'expanded' changed to 'accordion'. Removed option for expa…

1871330

…nded by default

ListSummaryFromEdges ul list no longer use cursive description

9f8ea0f

additional feature fields in accordian menu

cf35e07

snorrekim force-pushed the chore/portal-menu-accordion branch from 366f5ed to cf35e07 Compare September 26, 2024 10:14

vercel bot deployed to Preview September 26, 2024 10:36 View deployment

tujoworker approved these changes Sep 26, 2024

View reviewed changes

snorrekim merged commit e2604f6 into main Sep 27, 2024
10 checks passed

snorrekim deleted the chore/portal-menu-accordion branch September 27, 2024 07:22

tujoworker added the released label Sep 30, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

docs(Portal): add accordion to side menu #3794

docs(Portal): add accordion to side menu #3794

snorrekim commented Aug 6, 2024 •

edited

Loading

vercel bot commented Aug 6, 2024 •

edited

Loading

codesandbox-ci bot commented Aug 6, 2024 •

edited

Loading

snorrekim commented Sep 24, 2024 •

edited

Loading

tujoworker left a comment

tujoworker commented Sep 30, 2024

docs(Portal): add accordion to side menu #3794

docs(Portal): add accordion to side menu #3794

Conversation

snorrekim commented Aug 6, 2024 • edited Loading

Accordion

Menu ordering

New doc structure

Other

Not-implemented ideas for the future

vercel bot commented Aug 6, 2024 • edited Loading

codesandbox-ci bot commented Aug 6, 2024 • edited Loading

snorrekim commented Sep 24, 2024 • edited Loading

tujoworker left a comment

Choose a reason for hiding this comment

tujoworker commented Sep 30, 2024

snorrekim commented Aug 6, 2024 •

edited

Loading

vercel bot commented Aug 6, 2024 •

edited

Loading

codesandbox-ci bot commented Aug 6, 2024 •

edited

Loading

snorrekim commented Sep 24, 2024 •

edited

Loading