Skip to content

Commit ce25a06

Browse files
sangun-kangclaude
andcommitted
BIG BANG!
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
0 parents  commit ce25a06

143 files changed

Lines changed: 18233 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

.claude/settings.json

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
{
2+
"permissions": {
3+
"allow": [
4+
"Bash(git:*)",
5+
"Bash(gh:*)",
6+
"Bash(npm run lint:*)",
7+
"Bash(npm run typecheck:*)",
8+
"Bash(npm run test:*)",
9+
"Bash(npm run biome*:*)",
10+
"Bash(npm run build-storybook:*)",
11+
"Bash(npx tsc:*)",
12+
"Bash(ls:*)",
13+
"Bash(wc:*)",
14+
"Bash(head:*)",
15+
"Bash(find:*)",
16+
"Bash(diff:*)"
17+
],
18+
"deny": [
19+
"Bash(git push origin main*)",
20+
"Bash(git push origin master*)",
21+
"Bash(git push *--force*)",
22+
"Bash(git push *-f *)",
23+
"Bash(git reset --hard:*)",
24+
"Bash(git commit --amend:*)",
25+
"Bash(npm publish*)",
26+
"Bash(npm uninstall*)",
27+
"Bash(npm remove*)",
28+
"Bash(rm -rf:*)",
29+
"Bash(sudo:*)",
30+
"Read(**/.env*)",
31+
"Read(**/node_modules/**)",
32+
"Read(**/storybook-static/**)",
33+
"Read(**/dist/**)",
34+
"Read(**/.DS_Store)",
35+
"Read(**/.idea/**)",
36+
"Read(**/.vscode/**)",
37+
"Write(.env*)",
38+
"Write(**/secrets/**)"
39+
]
40+
}
41+
}

.github/workflows/ci.yml

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
name: CI
2+
3+
on:
4+
pull_request:
5+
push:
6+
branches: [main]
7+
8+
permissions:
9+
contents: read
10+
11+
concurrency:
12+
group: ci-${{ github.workflow }}-${{ github.ref }}
13+
cancel-in-progress: ${{ github.event_name == 'pull_request' }}
14+
15+
jobs:
16+
verify:
17+
runs-on: ubuntu-latest
18+
steps:
19+
- uses: actions/checkout@v4
20+
21+
- uses: actions/setup-node@v4
22+
with:
23+
node-version: 20
24+
cache: npm
25+
26+
- run: npm ci
27+
28+
- name: Lint (typecheck + biome)
29+
run: npm run lint
30+
31+
- name: Build
32+
run: npm run build
Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
name: Deploy Storybook
2+
3+
on:
4+
push:
5+
branches: [main]
6+
workflow_dispatch:
7+
8+
permissions:
9+
contents: read
10+
pages: write
11+
id-token: write
12+
13+
concurrency:
14+
group: pages
15+
cancel-in-progress: false
16+
17+
jobs:
18+
build:
19+
runs-on: ubuntu-latest
20+
steps:
21+
- uses: actions/checkout@v4
22+
23+
- uses: actions/setup-node@v4
24+
with:
25+
node-version: 20
26+
cache: npm
27+
28+
- run: npm ci
29+
30+
- name: Build Storybook
31+
run: npm run build-storybook
32+
33+
- uses: actions/configure-pages@v5
34+
35+
- uses: actions/upload-pages-artifact@v3
36+
with:
37+
path: storybook-static
38+
39+
deploy:
40+
needs: build
41+
runs-on: ubuntu-latest
42+
environment:
43+
name: github-pages
44+
url: ${{ steps.deployment.outputs.page_url }}
45+
steps:
46+
- id: deployment
47+
uses: actions/deploy-pages@v4

.gitignore

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
node_modules
2+
dist
3+
*.log
4+
.DS_Store
5+
.claude/out/
6+
.claude/settings.local.json
7+
.storybook/flavors/
8+
storybook-static/

.storybook/docs-spacing.scss

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
// Storybook docs ページの見出し周りの余白を調整
2+
.sbdocs-wrapper {
3+
.sbdocs-content {
4+
h1 {
5+
margin-bottom: 24px;
6+
}
7+
8+
h2 {
9+
margin-top: 48px;
10+
margin-bottom: 16px;
11+
}
12+
13+
h3 {
14+
margin-top: 32px;
15+
margin-bottom: 12px;
16+
}
17+
18+
// Canvas (story 埋め込み) の前後に余白
19+
.docs-story {
20+
margin-top: 16px;
21+
margin-bottom: 8px;
22+
}
23+
24+
// テーブルの上に余白
25+
table {
26+
margin-top: 8px;
27+
}
28+
29+
// コードブロックの前後
30+
pre {
31+
margin-top: 8px;
32+
}
33+
}
34+
}

.storybook/icon-font-override.scss

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
// Storybook用のアイコンフォント上書き
2+
@font-face {
3+
font-weight: 400;
4+
font-family: "Inhouse Icons";
5+
font-style: normal;
6+
src:
7+
url("../node_modules/@pepabo-inhouse/icon/dist/inhouse-icons.woff2") format("woff2"),
8+
url("../node_modules/@pepabo-inhouse/icon/dist/inhouse-icons.woff") format("woff");
9+
}

.storybook/main.ts

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import type { StorybookConfig } from '@storybook/react-vite'
2+
3+
const config: StorybookConfig = {
4+
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
5+
addons: ['@storybook/addon-links', '@storybook/addon-docs', '@storybook/addon-mcp'],
6+
7+
framework: {
8+
name: '@storybook/react-vite',
9+
options: {},
10+
},
11+
12+
typescript: {
13+
reactDocgen: 'react-docgen-typescript',
14+
reactDocgenTypescriptOptions: {
15+
shouldExtractLiteralValuesFromEnum: true,
16+
shouldRemoveUndefinedFromOptional: true,
17+
propFilter: (prop) =>
18+
prop.parent ? !/node_modules\/(?!react-aria-components)/.test(prop.parent.fileName) : true,
19+
},
20+
},
21+
22+
viteFinal: async (config) => {
23+
return {
24+
...config,
25+
css: {
26+
preprocessorOptions: {
27+
scss: {
28+
api: 'modern-compiler',
29+
silenceDeprecations: ['color-functions'],
30+
},
31+
},
32+
},
33+
}
34+
},
35+
}
36+
37+
export default config

.storybook/manager.tsx

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
import { useEffect } from 'react'
2+
import { addons, types, useGlobals } from 'storybook/manager-api'
3+
import { create } from 'storybook/theming/create'
4+
import { getColorsByFlavor, type FlavorName } from '../src/Token/Color/byFlavor'
5+
6+
function buildTheme(flavor: FlavorName) {
7+
const colors = getColorsByFlavor(flavor)
8+
const gray = colors.primitive.gray
9+
const white = colors.primitive.white
10+
const informative = colors.semantic.informative
11+
12+
return create({
13+
base: 'light',
14+
brandTitle: 'wip-ui',
15+
16+
// UI colors
17+
colorPrimary: informative['600'],
18+
colorSecondary: informative['600'],
19+
20+
// Background
21+
appBg: gray['50'],
22+
appContentBg: white['1000'],
23+
appPreviewBg: white['1000'],
24+
25+
// Border
26+
appBorderColor: gray['100'],
27+
appBorderRadius: 8,
28+
29+
// Text
30+
textColor: gray['900'],
31+
textInverseColor: white['1000'],
32+
33+
// Toolbar
34+
barBg: white['1000'],
35+
barTextColor: gray['800'],
36+
barSelectedColor: informative['600'],
37+
barHoverColor: informative['600'],
38+
39+
// Form
40+
inputBg: white['1000'],
41+
inputBorder: gray['100'],
42+
inputTextColor: gray['900'],
43+
inputBorderRadius: 4,
44+
})
45+
}
46+
47+
const defaultTheme = buildTheme('pepper')
48+
49+
addons.setConfig({ theme: defaultTheme })
50+
51+
function ThemeSync() {
52+
const [globals] = useGlobals()
53+
const flavor = ((globals.flavor as string) ?? 'pepper') as FlavorName
54+
55+
useEffect(() => {
56+
const theme = buildTheme(flavor)
57+
addons.setConfig({ theme })
58+
try {
59+
addons.getChannel().emit('forceReRender')
60+
} catch {
61+
// channel may not be ready on first mount
62+
}
63+
}, [flavor])
64+
65+
return null
66+
}
67+
68+
addons.register('flavor-theme-sync', () => {
69+
addons.add('flavor-theme-sync/tool', {
70+
type: types.TOOL,
71+
title: 'Flavor Theme Sync',
72+
render: ThemeSync,
73+
match: () => true,
74+
})
75+
})

.storybook/preview.ts

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
import type { Decorator, Preview } from '@storybook/react-vite'
2+
import { createElement } from 'react'
3+
4+
// Import icon font override for Storybook
5+
import './icon-font-override.scss'
6+
// Import docs page spacing overrides
7+
import './docs-spacing.scss'
8+
9+
// Import pre-built flavor CSS files
10+
import './flavors/pepper.css'
11+
import './flavors/minne.css'
12+
import './flavors/apollo.css'
13+
import './flavors/nachiguro.css'
14+
import './flavors/flippers.css'
15+
import './flavors/kung-pu.css'
16+
import './flavors/lolipop.css'
17+
18+
const flavorDecorator: Decorator = (Story, context) => {
19+
const flavor = (context.globals.flavor as string) ?? 'pepper'
20+
return createElement(
21+
'div',
22+
{ 'data-flavor': flavor, style: { display: 'contents' } },
23+
createElement(Story)
24+
)
25+
}
26+
27+
const preview: Preview = {
28+
globalTypes: {
29+
flavor: {
30+
description: 'Design token flavor / theme',
31+
toolbar: {
32+
title: 'Flavor',
33+
icon: 'paintbrush',
34+
items: [
35+
{ value: 'pepper', title: 'Pepper' },
36+
{ value: 'minne', title: 'Minne' },
37+
{ value: 'apollo', title: 'Apollo' },
38+
{ value: 'nachiguro', title: 'Nachiguro' },
39+
{ value: 'flippers', title: 'Flippers' },
40+
{ value: 'kung-pu', title: 'Kung-pu' },
41+
{ value: 'lolipop', title: 'Lolipop' },
42+
],
43+
dynamicTitle: true,
44+
},
45+
},
46+
},
47+
initialGlobals: {
48+
flavor: 'pepper',
49+
},
50+
decorators: [flavorDecorator],
51+
parameters: {
52+
options: {
53+
storySort: {
54+
order: [
55+
'Introduction',
56+
['Overview', 'Getting Started', 'FlavorProvider', 'Changelog'],
57+
'Foundations',
58+
['Colors', 'Typography', 'Spacing', 'Elevation', 'Breakpoints', 'Icons'],
59+
'Components',
60+
[
61+
'Layout',
62+
'Actions',
63+
'Forms',
64+
'Data Display',
65+
'Surfaces',
66+
'Feedback',
67+
'Navigation',
68+
],
69+
],
70+
},
71+
},
72+
controls: {
73+
matchers: {
74+
color: /(background|color)$/i,
75+
date: /Date$/i,
76+
},
77+
},
78+
},
79+
}
80+
81+
export default preview

.vscode/settings.json

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"typescript.tsdk": "admin/frontend/node_modules/typescript/lib",
3+
"typescript.enablePromptUseWorkspaceTsdk": true,
4+
"editor.formatOnSave": true,
5+
"editor.defaultFormatter": "biomejs.biome",
6+
"biome.lspBin": "admin/frontend/node_modules/@biomejs/biome/bin/biome",
7+
"editor.codeActionsOnSave": {
8+
"quickfix.biome": "explicit",
9+
"source.organizeImports.biome": "explicit",
10+
"source.fixAll.biome": "explicit"
11+
},
12+
"[typescript]": {
13+
"editor.defaultFormatter": "biomejs.biome"
14+
},
15+
"[typescriptreact]": {
16+
"editor.defaultFormatter": "biomejs.biome"
17+
},
18+
"[javascript]": {
19+
"editor.defaultFormatter": "biomejs.biome"
20+
},
21+
"[javascriptreact]": {
22+
"editor.defaultFormatter": "biomejs.biome"
23+
}
24+
}

0 commit comments

Comments
 (0)