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.

Sign up for GitHub

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!: FormControl,Fieldsetのtitleにアイコンやボタンを含めずマークアップできるよう属性を追加 #5235

Merged
merged 9 commits into from
Jan 9, 2025
Merged

feat!: FormControl,Fieldsetのtitleにアイコンやボタンを含めずマークアップできるよう属性を追加 #5235

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
00e1a37
feat: FormControl,Fieldsetのtitleにアイコンやボタンを含めずマークアップできるよう属性を追加
AtsushiM Jan 6, 2025
ea182a5
chore: FormControl, Fieldsetのロジックを最適化
AtsushiM Jan 6, 2025
03437db
Merge branch 'master' of https://github.com/kufu/smarthr-ui into feat…
AtsushiM Jan 8, 2025
ccd83a8
chore: FieldsetのVisuallyHidden legend の内容をテキストのみにする
AtsushiM Jan 8, 2025
a7699ab
fix: fieldsetとlegendが正しく紐づく様になっているため、不要なaria-labelledby関係の属性を削除する
AtsushiM Jan 8, 2025
38a8849
chore: ifのネストを浅くする
AtsushiM Jan 8, 2025
bf34617
Merge branch 'master' of https://github.com/kufu/smarthr-ui into feat…
AtsushiM Jan 9, 2025
172a47f
chore: isRoleGroup -> isFieldset
AtsushiM Jan 9, 2025
7ef464a
chore: fix storybook
AtsushiM Jan 9, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions packages/smarthr-ui/src/components/Fieldset/Fieldset.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@ import React, { ComponentProps } from 'react'

import { ActualFormControl } from '../FormControl/FormControl'

export const Fieldset: React.FC<Omit<ComponentProps<typeof ActualFormControl>, 'as'>> = (props) => (
<ActualFormControl {...props} as="fieldset" />
)
export const Fieldset: React.FC<
Omit<ComponentProps<typeof ActualFormControl>, 'as' | 'htmlFor' | 'labelId'>
> = (props) => <ActualFormControl {...props} as="fieldset" />
12 changes: 12 additions & 0 deletions packages/smarthr-ui/src/components/Fieldset/stories/Fieldset.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,18 @@ export const TitleType: StoryObj<typeof Fieldset> = {
),
}

export const SubActionArea: StoryObj<typeof Fieldset> = {
name: 'subActionArea',
args: {
subActionArea: (
<Cluster justify="space-between">
<div>サブアクションエリア（start)</div>
<div>サブアクションエリア（end)</div>
</Cluster>
),
},
}

export const DangerouslyTitleHidden: StoryObj<typeof Fieldset> = {
name: 'dangerouslyTitleHidden（非推奨）',
args: {
Expand Down
8 changes: 7 additions & 1 deletion packages/smarthr-ui/src/components/Fieldset/stories/VRTFieldset.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React from 'react'

import { Stack } from '../../Layout'
import { Cluster, Stack } from '../../Layout'
import { Fieldset } from '../Fieldset'

import { _childrenOptions } from './Fieldset.stories'
Expand Down Expand Up @@ -33,6 +33,12 @@ export default {
args: {
title: 'フィールドセットタイトル',
statusLabelProps: { type: 'grey', children: '任意' },
subActionArea: (
<Cluster justify="space-between">
<div>サブアクションエリア（start)</div>
<div>サブアクションエリア（end)</div>
</Cluster>
),
helpMessage: 'フィールドセットの補足となるヘルプメッセージを入れます。',
exampleMessage: '入力欄に入れる入力例',
errorMessages: ['入力されていません', '20文字以上入力してください。'],
Expand Down
Loading
Loading