Skip to content

Commit fce5496

Browse files
authored
Merge pull request #144 from digital-go-jp/v2
merge v2 into main
2 parents 1685b0a + 615d115 commit fce5496

File tree

21 files changed

+996
-1026
lines changed

21 files changed

+996
-1026
lines changed

README.md

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,9 @@
88

99
このリポジトリでは全てのコンポーネントは実装していません。
1010
(定期的にサンプルは追加予定です。)
11-
未実装のコンポーネントについてはスクラッチで書かずに、以下のようなヘッドレスUIライブラリの利用を推奨します
11+
未実装のコンポーネントについてはスクラッチで書かずに、ヘッドレスUIライブラリの利用を推奨します
1212

13-
- [React Aria](https://react-spectrum.adobe.com/react-aria/index.html)
14-
- [Radix UI](https://www.radix-ui.com/)
15-
- [Headless UI](https://headlessui.com/)
16-
17-
スクラッチで書く場合は、[ARIA Authoring Practices Guide (APG)](https://www.w3.org/WAI/ARIA/apg/)[Patterns](https://www.w3.org/WAI/ARIA/apg/patterns/)を参考にして実装を進める事を推奨します。
13+
スクラッチで書く必要がある場合は、[ARIA Authoring Practices Guide (APG)](https://www.w3.org/WAI/ARIA/apg/)[Patterns](https://www.w3.org/WAI/ARIA/apg/patterns/)を参考にして実装を進める事を推奨します。
1814

1915
## サンプルコード
2016

package-lock.json

Lines changed: 933 additions & 954 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -39,34 +39,34 @@
3939
"storybook:test": "test-storybook"
4040
},
4141
"dependencies": {
42-
"@digital-go-jp/tailwind-theme-plugin": "^0.2.1",
42+
"@digital-go-jp/tailwind-theme-plugin": "^0.2.2",
4343
"react": "^18.3.1",
4444
"react-dom": "^18.3.1",
45-
"tailwindcss": "^3.4.15"
45+
"tailwindcss": "^3.4.17"
4646
},
4747
"devDependencies": {
4848
"@biomejs/biome": "^1.9.4",
4949
"@markuplint/jsx-parser": "^4.7.13",
5050
"@markuplint/react-spec": "^4.5.11",
51-
"@storybook/addon-a11y": "^8.4.5",
52-
"@storybook/addon-essentials": "^8.4.5",
53-
"@storybook/addon-interactions": "^8.4.5",
54-
"@storybook/addon-links": "^8.4.5",
55-
"@storybook/blocks": "^8.4.5",
56-
"@storybook/react": "^8.4.5",
57-
"@storybook/react-vite": "^8.4.5",
58-
"@storybook/test": "^8.4.5",
51+
"@storybook/addon-a11y": "^8.4.7",
52+
"@storybook/addon-essentials": "^8.4.7",
53+
"@storybook/addon-interactions": "^8.4.7",
54+
"@storybook/addon-links": "^8.4.7",
55+
"@storybook/blocks": "^8.4.7",
56+
"@storybook/react": "^8.4.7",
57+
"@storybook/react-vite": "^8.4.7",
58+
"@storybook/test": "^8.4.7",
5959
"@tsconfig/node20": "^20.1.4",
60-
"@types/node": "^22.9.1",
60+
"@types/node": "^22.10.2",
6161
"@types/react": "^18.3.12",
6262
"@types/react-dom": "^18.3.1",
6363
"@vitejs/plugin-react-swc": "^3.7.1",
6464
"autoprefixer": "^10.4.20",
6565
"markuplint": "^4.11.3",
6666
"postcss": "^8.4.49",
67-
"storybook": "^8.4.5",
68-
"typescript": "^5.6.3",
69-
"vite": "^5.4.11"
67+
"storybook": "^8.4.7",
68+
"typescript": "^5.7.2",
69+
"vite": "^6.0.5"
7070
},
7171
"engines": {
7272
"node": ">=18"

src/components/Breadcrumbs/Breadcrumbs.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export const breadcrumbLinkStyle = `
4646
text-blue-1000 text-oln-16N-100 underline underline-offset-[calc(3/16*1rem)]
4747
hover:text-blue-900 hover:decoration-[calc(3/16*1rem)]
4848
active:text-orange-700 active:decoration-1
49-
focus-visible:rounded focus-visible:outline focus-visible:outline-4 focus-visible:outline-black focus-visible:outline-offset-[calc(2/16*1rem)] focus-visible:bg-yellow-300 focus-visible:text-blue-1000 focus-visible:ring-[calc(2/16*1rem)] focus-visible:ring-yellow-300
49+
focus-visible:rounded-4 focus-visible:outline focus-visible:outline-4 focus-visible:outline-black focus-visible:outline-offset-[calc(2/16*1rem)] focus-visible:bg-yellow-300 focus-visible:text-blue-1000 focus-visible:ring-[calc(2/16*1rem)] focus-visible:ring-yellow-300
5050
`;
5151

5252
export type BreadcrumbLinkProps = {

src/components/Button/Button.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -54,10 +54,10 @@ export const buttonVariantStyle: { [key in ButtonVariant]: string } = {
5454
};
5555

5656
export const buttonSizeStyle: { [key in ButtonSize]: string } = {
57-
lg: 'min-w-[calc(136/16*1rem)] min-h-14 rounded-lg px-4 py-3 text-oln-16B-100',
58-
md: 'min-w-24 min-h-12 rounded-lg px-4 py-2 text-oln-16B-100',
59-
sm: 'relative min-w-20 min-h-9 rounded-md px-3 py-0.5 text-oln-16B-100 after:absolute after:inset-x-0 after:-inset-y-full after:m-auto after:h-[44px]',
60-
xs: 'relative min-w-18 min-h-7 rounded px-2 py-0.5 text-oln-14B-100 after:absolute after:inset-x-0 after:-inset-y-full after:m-auto after:h-[44px]',
57+
lg: 'min-w-[calc(136/16*1rem)] min-h-14 rounded-8 px-4 py-3 text-oln-16B-100',
58+
md: 'min-w-24 min-h-12 rounded-8 px-4 py-2 text-oln-16B-100',
59+
sm: 'relative min-w-20 min-h-9 rounded-6 px-3 py-0.5 text-oln-16B-100 after:absolute after:inset-x-0 after:-inset-y-full after:m-auto after:h-[44px]',
60+
xs: 'relative min-w-18 min-h-7 rounded-4 px-2 py-0.5 text-oln-14B-100 after:absolute after:inset-x-0 after:-inset-y-full after:m-auto after:h-[44px]',
6161
};
6262

6363
export type ButtonProps = {

src/components/EmergencyBanner/parts/Button.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export const EmergencyBannerButton = (props: Props) => {
88
return (
99
<div
1010
className={`
11-
flex items-center justify-center mx-auto mt-6 mb-1 w-fit min-w-64 p-4 bg-error-1 text-white text-oln-16B-100 rounded-lg
11+
flex items-center justify-center mx-auto mt-6 mb-1 w-fit min-w-64 p-4 bg-error-1 text-white text-oln-16B-100 rounded-8
1212
outline outline-2 outline-error-1 outline-offset-[calc(2/16*1rem)]
1313
desktop:outline-4 desktop:outline-offset-[calc(4/16*1rem)] desktop:mt-8 desktop:mb-2
1414
${className ?? ''}

src/components/HamburgerMenuButton/HamburgerMenuButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export const HamburgerMenuButton = forwardRef<HTMLButtonElement, HamburgerMenuBu
99
return (
1010
<button
1111
className={`
12-
flex w-fit items-center gap-x-1.5 text-oln-16N-100 rounded touch-manipulation
12+
flex w-fit items-center gap-x-1.5 text-oln-16N-100 rounded-4 touch-manipulation
1313
hover:bg-solid-gray-50 hover:underline hover:underline-offset-[calc(3/16*1rem)]
1414
focus-visible:outline focus-visible:outline-4 focus-visible:outline-black focus-visible:outline-offset-[calc(2/16*1rem)] focus-visible:bg-yellow-300 focus-visible:ring-[calc(2/16*1rem)] focus-visible:ring-yellow-300
1515
${className ?? ''}

src/components/Input/Input.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {
2222
return (
2323
<input
2424
className={`
25-
max-w-full rounded-lg border bg-white px-4 py-3 text-oln-16N-100 text-solid-gray-800
25+
max-w-full rounded-8 border bg-white px-4 py-3 text-oln-16N-100 text-solid-gray-800
2626
${InputBlockSizeStyle[blockSize]}
2727
${isError ? 'border-error-1' : 'border-solid-gray-900'}
2828
focus:outline focus:outline-4 focus:outline-black focus:outline-offset-[calc(2/16*1rem)] focus:ring-[calc(2/16*1rem)] focus:ring-yellow-300

src/components/LanguageSelector/LanguageSelector.stories.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -251,7 +251,7 @@ export const WithoutLabel: Story = {
251251
<LanguageSelectorButton
252252
aria-controls={`${sampleId}-menu`}
253253
aria-expanded={isMenuOpen}
254-
className='!px-0 !gap-0 !rounded hover:outline hover:outline-black'
254+
className='!px-0 !gap-0 !rounded-4 hover:outline hover:outline-black'
255255
onClick={() => setIsMenuOpen(!isMenuOpen)}
256256
ref={buttonRef}
257257
>
@@ -520,7 +520,7 @@ export const Responsive: Story = {
520520
<LanguageSelectorButton
521521
aria-controls={`${sampleId}-menu`}
522522
aria-expanded={isMenuOpen}
523-
className='!px-0 !gap-0 !rounded hover:outline hover:outline-black desktop:!px-2 desktop:!gap-1 desktop:!rounded-lg desktop:hover:[&:not(:focus-visible)]:outline-0'
523+
className='!px-0 !gap-0 !rounded-4 hover:outline hover:outline-black desktop:!px-2 desktop:!gap-1 desktop:!rounded-8 desktop:hover:[&:not(:focus-visible)]:outline-0'
524524
onClick={() => setIsMenuOpen(!isMenuOpen)}
525525
ref={buttonRef}
526526
>
@@ -586,7 +586,7 @@ export const OnlyUI = {
586586
</LanguageSelector>
587587

588588
<LanguageSelector>
589-
<LanguageSelectorButton className='!px-0 !py-0 !gap-0 !rounded hover:outline hover:outline-black'>
589+
<LanguageSelectorButton className='!px-0 !py-0 !gap-0 !rounded-4 hover:outline hover:outline-black'>
590590
<LanguageSelectorGlobeWithLabelIcon />
591591
<LanguageSelectorArrowIcon className='mt-0.5 rotate-180' />
592592
</LanguageSelectorButton>

src/components/LanguageSelector/parts/Button.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export const LanguageSelectorButton = forwardRef<HTMLButtonElement, LanguageSele
99
return (
1010
<button
1111
className={`
12-
flex w-fit gap-1 items-center px-2 min-h-[calc(44/16*1rem)] text-oln-16N-100 text-solid-gray-800 rounded-lg
12+
flex w-fit gap-1 items-center px-2 min-h-[calc(44/16*1rem)] text-oln-16N-100 text-solid-gray-800 rounded-8
1313
hover:bg-solid-gray-50 hover:underline hover:underline-offset-[calc(3/16*1rem)]
1414
focus-visible:outline focus-visible:outline-4 focus-visible:outline-black focus-visible:outline-offset-[calc(2/16*1rem)] focus-visible:ring-[calc(2/16*1rem)] focus-visible:ring-yellow-300 focus-visible:bg-yellow-300
1515
${className ?? ''}

0 commit comments

Comments
 (0)