-
Notifications
You must be signed in to change notification settings - Fork 2.2k
[core] feat: Section component #6245
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
@CPerinet I cleaned up some of the code based on my review.
|
Re: edge case where tabs & collapsible are both enabled. We can work around this by making these props mutually exclusive. Also, I think the collapse feature should actually use the |
Note that I updated the docs page a bit and fixed the console error related to duplicate docs headings (you can't have two instances of the same heading in a |
I've removed Tabs support for now. It has some complications which we need to address, and we don't need to implement all the features in one PR. We can bring back that feature in a separate PR. |
I tried this out and it turns out to be kind of cumbersome to implement. The SectionHeader would need to know a lot of the state that Section has access to, specifically |
@@ -213,6 +214,17 @@ export const MULTISTEP_DIALOG_RIGHT_PANEL = `${MULTISTEP_DIALOG}-right-panel`; | |||
export const MULTISTEP_DIALOG_NAV_TOP = `${MULTISTEP_DIALOG}-nav-top`; | |||
export const MULTISTEP_DIALOG_NAV_RIGHT = `${MULTISTEP_DIALOG}-nav-right`; | |||
|
|||
export const SECTION = `${NS}-section`; | |||
export const SECTION_COLLAPSED = `${SECTION}-collapsed`; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I prefer to add a "section"-namespaced "collapsed" class name for now rather than a .bp5-collapsed
name.
packages/docs-app/src/examples/core-examples/sectionExample.tsx
Outdated
Show resolved
Hide resolved
align-items: start; | ||
} | ||
|
||
.metadata-panel { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@CPerinet for future reference: styling of example content should be done in CSS like this
Uh oh!
There was an error while loading. Please reload this page.