provide SPA route's experience with native web component

NOTICE! this demo use `:defined` pseudo-class to avoid undefined element's inner content leak

BTW. you can use `disable-shadow` to disable shadowDOM

• common
• nest path: root
• nest path: root/all
• cache and drop
• cache input 1
• cache input 2
• drop input 1 (will drop input value after switch route)
• drop input 2 (will drop input value after switch route)
• lazy demo
  • @shoelace-style/shoelace Button
  • render shoelace Button after module ready, disable cache to get clear effect
• custom render demo, this could be use to render react/vue/other render lib content
  If you are in a local environment, you need to additionally run the pnpm run dev:demo command
  • react 17 demo
  • react 17 custom render name
  • react 17 with css
  • vue 3 demo (enable drop)
• append before
• append after
• loading status

common demo area

route container demo area

• container
• unvalid route
• valid route

no shadow dom route container demo area

• container
• unvalid route
• valid route

dynamic route path

• dynamic route
• matched value 1
• matched value 2
• matched value 3
• matched value 4
• not matched