-
Notifications
You must be signed in to change notification settings - Fork 829
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
[Emotion] Convert EuiDataGrid gridStyle
s to Emotion (Part 3)
#8006
Conversation
5d04264
to
f65e427
Compare
gridStyle
s to Emotion (part 3)
6afaa83
to
d7d7e53
Compare
gridStyle
s to Emotion (part 3)gridStyle
s to Emotion (Part 3)
- unfortunately can't be as specific here, has to be applied to top level datagrid styles
- handle this at topmost grid level, I personally don't think it makes any sense to split it up by component when they affect each other - more files makes it harder to write/predict + clean up several CSS unsets by assuming lack of borders rather than presence of borders
- some fontSize/lineHeight tweaking required to stay the same as prod (due to changes Caroline made to euiFontSize) + improve Emotion className labeling
- we can now obtain cell padding sizes from dynamic themes, hooray
- pass `gridStyles` down through the body and to the rows so CSS can be a bit flatter, as those styles only concern those components + convert enzyme tests to RTL
+ remove unnecessary show footer toggle - it's the entire point of the demo, why would we disable it? + remove flex in favor of EuiSpacer
- grid borders and header/footer underline/overlines were conflicting with one another - borders on header/footer cells were adding extra height to the cells themselves (unlike regular row cells)
…utils - VRT stories should use minimal data still for screenshot simplicity + add 2 new stories with more customizable controls, which lists the nested props documentation for each nested config
- allows us to expand props documentation & use controls for `rowHeightsOptions` + add test for lineHeight
d7d7e53
to
92e6fd8
Compare
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.
Awesome work on the conversion, you added some nice little code improvements and I didn't see any unexpected regression 🎉
And I really dig the storybook organization update 👏 I left a couple small questions, but nothing major.
packages/eui/src/components/datagrid/data_grid_styles.stories.tsx
Outdated
Show resolved
Hide resolved
+ remove `PRESERVED_FALSE_VALUE_PROPS` logic - we should let the defaultProps logic handle that instead and always show `false` props if they're non-defaults (testable on, e.g. `<EuiExpression uppercase={false} />`)
💚 Build Succeeded
History
|
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.
🚢 🐈⬛ Thanks for the updates, all looking good to me now 👍
Summary
Part of #6394
This PR looks intimidating in terms of file diff, but I promise the majority of it is just Storybooks! As such I strongly recommend following along by commit. The TL;DR of changes:
gridStyle
to Emotion (rows, borders, and cell density)stories.utils.tsx
file as a way to generate fake 'components' that would fool Storybook's react docgen, as well as to share a stateful datagrid:QA
General checklist
- [ ] Checked in mobile- [ ] Checked for accessibility including keyboard-only and screenreader modes@default
if default values are missing)- [ ] Checked Code Sandbox works for any docs examplesand cypress tests- [ ] If applicable, added the breaking change issue label (and filled out the breaking change checklist)