search

mi6 / ic-design-system

Intelligence Community Design System
https://design.sis.gov.uk
MIT License
40 stars 27 forks source link

[ic-design-system]: Improved docs for using ICDS navigation components with third party routing tools #812

Open jd239 opened 7 months ago

jd239 commented 7 months ago

Summary

This improvement ticket involves adding more examples to using ICDS navigation components alongside third party routing tools such as Next.js and Remix.

💬 Description

It is possible to slot third party navigation components into Top Navigation and Side Navigation, however, it is not clear how to use the 'active' state. There is an example within Top Navigation which displays the 'Get started' navigation with the active state but there is nothing within the code snippet to indicate how this is achieved.

It would be good to have code snippets using different javascript frameworks to demonstrate how this can be achieved.

💰 Use value

Improve the experience with using the main ICDS layout components alongside existing external routing tools.

📝 Acceptance Criteria

If relevant, describe in full detail the different interactions and edge cases that the component or patterns needs to fulfil.

Given I am a developer building an application When I integrate routing into my application with top navigation
Then when I click on navigation item, I would like to have the active state/styling appear

✏ Designs

N/A

🧾 Guidance

This task involves update the guidance

Additional info

Frameworks in mind are:

MI6-255 commented 3 months ago

This would be writing a page on Routing on how to support any libraries, not a code example per component/library

MI6-255 commented 3 months ago

No Stackblitz buttons