Feat: label redesign #1043
Draft
Feat: label redesign #1043
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Current coverage reportSummary
Tests which was executed
Coverage by files (63%)
|
Jest Unit tests resultsDuration: 216.355 seconds
Outcome: Passed | Total Tests: 315 | Passed: 315 | Failed: 0
|
tuul-wq
requested changes
Sep 1, 2023
|
|
||
| import { BlockExplorer } from './BlockExplorer'; | ||
|
|
||
| export default { |
There was a problem hiding this comment.
Storybook declaration has changed, take a look at Buttons
| parameters: { actions: { argTypesRegex: '^on.*' } }, | ||
| } as ComponentMeta<typeof Label>; | ||
|
|
||
| const Template: ComponentStory<typeof Label> = (args) => <Label {...args} />; |
There was a problem hiding this comment.
Storybook declaration has changed
|
|
||
| import { Label } from './Label'; | ||
|
|
||
| describe('ui/LabelHelpBox', () => { |
There was a problem hiding this comment.
Suggested change
| describe('ui/LabelHelpBox', () => { | |
| describe('ui/Label', () => { |
| @@ -0,0 +1,17 @@ | |||
| export type LabelPallet = 'default' | 'accent' | 'positive' | 'negative' | 'shade'; | |||
|
|
|||
| export const LabelStyle: Record<LabelPallet, string> = { | |||
There was a problem hiding this comment.
Looks like text color on parent component is redundant, because we redeclare text color on <CaptionText />
|
|
||
| export const Label = ({ className, children, pallet = 'default' }: PropsWithChildren<Props>) => ( | ||
| <div className={cnTw('rounded-lg py-0.5 px-2 group w-fit', LabelStyle[pallet], className)} data-testid="label"> | ||
| <CaptionText className={cnTw('uppercase', LabelTextStyle[pallet])}>{children}</CaptionText> |
There was a problem hiding this comment.
I assume it's better to declare children: string, so nobody provides ReactNode in here
Like you did in <BlockExplorer /> 👍
| }; | ||
|
|
||
| export const LabelHelpBox = ({ className, children }: PropsWithChildren<Props>) => ( | ||
| <div | ||
| export const LabelHelpBox = ({ className, children, disabled = false, ...props }: PropsWithChildren<Props>) => ( |
There was a problem hiding this comment.
What kind of props might come here? Without explicit declaration in Props it's not clear
Maybe it's not needed at all?
Also I would add children: string as well 😉
| <BodyText>{children}</BodyText> | ||
| <Icon name="learn-more" className="group-hover:text-icon-hover group-active:text-icon-active" size={16} /> | ||
| </div> | ||
| <FootnoteText className={cnTw('text-text-primary', disabled && 'text-text-tertiary')}>{children}</FootnoteText> |
There was a problem hiding this comment.
This is optional, could leave as you've done
Suggested change
| <FootnoteText className={cnTw('text-text-primary', disabled && 'text-text-tertiary')}>{children}</FootnoteText> | |
| <FootnoteText className={disabled ? 'text-text-tertiary' : 'text-text-primary'}>{children}</FootnoteText> |
| type PopoverProps = ComponentProps<typeof Popover> & { pointer?: 'up' | 'down' }; | ||
| type PointerDirection = 'up' | 'down'; | ||
| type PointerPosition = 'start' | 'center' | 'end'; | ||
| type PopoverProps = ComponentProps<typeof Popover> & { |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.