UX-575 upgrade to 6.0 alpha, refactor stories for sidepanel

[oscarkwan]

Purpose 🚀

• Bump storybook to 6.0 alpha
• Refactor sidepanel stories

Notes ✏️

• with storybook 6.0, viewmode is introduced to make sure stories are defaulted to a certain mode.
• Sidepanel mdx file is WIP (will be done in a future PR), right now it just shows the prop table
• Removed background prop for SidePanel.Overlay

Updates 📦

• MAJOR (breaking) change to SidePanel

Storybook 📕

http://storybooks.highbond-s3.com/paprika/UX-575-sidepanel-stories

[nahumzs]

fyi seems like storybook has a bug you can't toggle stories unless those stories have the folder icon, don't know why :P no blocker but just weird behaviour from storybook

[oscarkwan]

Hm, in my version?

[mikrotron]

I think this technically constitutes a breaking change to SidePanel. I'm okay with that, it will be very low impact, but please indicate that in the PR description, tag the PR with that label, and add a note to the CHANGELOG.

[nahumzs]

yeap in this version, but no big deal.

[mikrotron]

yeap in this version, but not big deal.

You can't toggle any expandable selection closed, if the active story is contained below. And since a "component" section auto selects the first story, you're seeing that behaviour. If you go selecte the Heading/Showcase story, then you can close the Guard, but won't be able to close the Heading. This make some sense, if you collapse the section with the active page... then you can't see where the active page is anymore and you can get lost.

[mikrotron]

Can you add !important to the body { padding:0; } rule in /.storybook/reset.scss? The extra padding is bothering me, especially on the cover page where there's now a scrollbar.

[mikrotron]

Hey, I think that with these new options, we don't need the confusing "Canvas / Docs" tabs at all! In fact, it seems they can be turned off, while still maintaining the rest of that "canvas toolbar" by adding this to the story parameters:

previewTabs: {
  canvas: { hidden: true },
}

Reference: storybookjs/storybook#9095

What do you think?

[mikrotron]