feat(PreviewTip): add preview tip #2923
Conversation
| @@ -82,6 +86,6 @@ describe('IconButton', () => { | |||
|
|
|||
| userEvent.hover(cta); | |||
|
|
|||
| view.getByText(tip); | |||
| await waitFor(() => view.getByText(tip)); | |||
There was a problem hiding this comment.
nit: i think this is the same as doing await findByText(tip)
There was a problem hiding this comment.
since view isn't async, waitFor makes the functions wait around until it's true (or it times out)
)
There was a problem hiding this comment.
isnt that what findBy does https://testing-library.com/docs/dom-testing-library/api-async/#findby-queries
| return ( | ||
| <GridBox | ||
| gridTemplateAreas={gridTemplateAreas} | ||
| gridTemplateColumns={avatar ? avatarColumnTemplate : '1fr'} |
There was a problem hiding this comment.
should the 1fr here be using defaultGridTemplate?
There was a problem hiding this comment.
good call, thank you!
| overline="overline" | ||
| href="/test" | ||
| > | ||
| I am a test tooltip |
There was a problem hiding this comment.
super nit: should this say preview tip instead?
| {(args) => ( | ||
| <FlexBox py={156} width="100%" justifyContent="space-around"> | ||
| <PreviewTip {...args} truncateLines={2} alignment="top-right" /> | ||
| <PreviewTip {...args} truncateLines={5} alignment="bottom-left" /> |
There was a problem hiding this comment.
do we want to change the lines here? truncating to 5 lines doesnt actually truncate with the current text
|
|
||
| ## Loading | ||
|
|
||
| The `loading` prop will render a <LinkTo component="Shimmer">`Shimmer`</LinkTo> loading state. See an exmaple below! |
There was a problem hiding this comment.
lol example spelled wrong
| <Story name="Loading PreviewTip"> | ||
| {() => ( | ||
| <FlexBox center py={156}> | ||
| <LoadingTip /> |
There was a problem hiding this comment.
hmmm i'm not actually seeing the LoadingTip here...
good catch! i'll ask stacey |
📬Published Alpha Packages:@codecademy/[email protected] |
|
🚀 Styleguide deploy preview ready! |
Overview
Add new PreviewTip component, restructures some shared
tipcomponents, and adds a 3ms delay to to hover/focus tips (like PreviewTip + ToolTip)PR Checklist
Testing Instructions
PR Links and Envs