Skip to content
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

feat(SideNav): Composition できるように修正 #5157

Open
wants to merge 7 commits into
base: master
Choose a base branch
from

Conversation

masa0527
Copy link
Contributor

@masa0527 masa0527 commented Dec 2, 2024

関連URL

https://smarthr.atlassian.net/browse/SHRUI-1143

概要

SideNavのstoryの見直しをしました。

変更内容

確認方法

Chromaticで確認

@masa0527 masa0527 requested a review from a team as a code owner December 2, 2024 03:28
Copy link

pkg-pr-new bot commented Dec 2, 2024

Open in Stackblitz

npm i https://pkg.pr.new/kufu/smarthr-ui@5157

commit: 5bc5ca6

Copy link
Collaborator

@uknmr uknmr left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

諸々コメントしましたが、items を deprecated し、SideNav と SideNavItem という composition で使う状態にしてから Story を書いたほうが良さそうに思いました(書き直しになってしまいそう)。

@masa0527 masa0527 changed the title docs: SideNavのstoryを見直し feat(SideNav): Composition できるように修正 Dec 5, 2024
@masa0527
Copy link
Contributor Author

masa0527 commented Dec 6, 2024

@uknmr
composition に対応してみました!

packages/smarthr-ui/src/components/SideNav/SideNav.tsx Outdated Show resolved Hide resolved
packages/smarthr-ui/src/components/SideNav/SideNav.tsx Outdated Show resolved Hide resolved
parameters: {
chromatic: { disableSnapshot: true },
},
tags: ['skip-test-runner'],
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

q: li で怒られる?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<ul>をrenderに追加して対応

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<ul> 追加したのであれば、削っても大丈夫?

Suggested change
tags: ['skip-test-runner'],

Comment on lines +32 to +33
transform: (code: string) =>
code.replace(/<ul>|<\/ul>|<Stack as="ul">|<\/Stack>/g, '').trim(),
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

なるほどなぁ、と思ったんですがやるなら方針決めて全 Story ガッと対応した方が良いと思いました!
インデントが揃ってないのも気になります。
image

<SideNavItemButton {...args}>サイドナビ</SideNavItemButton>
</ul>
),
argTypes: {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

children を control: 'text' で足したい

child as React.ReactElement<ComponentProps<typeof SideNavItemButton>>,
{
size,
...(childProps.onClick ? {} : { onClick }),
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

パッと見、消してしまいそうなのでコメントを残しとくとよさそう

const sideNavItem = tv({
slots: {
wrapper: ['smarthr-ui-SideNav-item'],
wrapper: ['smarthr-ui-SideNav-item', 'shr-list-none'],
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

SideNav 側で指定されてるので不要そう(Story のためであれば Story に書くのがよさそう)

parameters: {
chromatic: { disableSnapshot: true },
},
tags: ['skip-test-runner'],
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<ul> 追加したのであれば、削っても大丈夫?

Suggested change
tags: ['skip-test-runner'],

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants