yunchan/d3ro-voice
1
0
Fork 0
Code Issues Pull requests Projects Releases 2 Packages Wiki Activity Actions

feat(release): prepare 1.1.0 candidate

Browse source
This commit is contained in:
Yun Chan 2026-08-29 18:33:45 +09:00
parent 5a34f66981
commit 5205dcdfa9
736 changed files with 115667 additions and 12203 deletions
Download patch file Download diff file Expand all files Collapse all files

2
packages/ui/package.json
View file

@ -1,6 +1,6 @@
{
"name": "@d3ro/ui",
"version": "1.0.0",
"version": "1.1.0",
"private": true,
"description": "D3RO Voice 공유 UI — 디자인 시스템 컴포넌트 + 테마 토큰 + CSS 변수 맵",
"license": "MIT",

2
packages/ui/src/components/ds/InstrumentPanel.tsx
View file

@ -80,7 +80,7 @@ function Engraving({ children, sx }: { children: string; sx: Record<string, unkn
letterSpacing: d3roTypo.engrave.spacing,
color: d3roPalette.text.dimLabel,
opacity: 0.7,
fontWeight: 700,
fontWeight: 500,
fontFamily: d3roFontMono,
textTransform: 'uppercase',
zIndex: 2,

2
packages/ui/src/components/ds/SegmentControl.tsx
View file

@ -109,7 +109,7 @@ export function SegmentControl<T extends string = string>({
bgcolor: isSelected ? d3roPalette.accent.dim : d3roPalette.bg.chassis,
color: isSelected ? d3roPalette.accent.light : d3roPalette.text.dimLabel,
fontSize: '10px',
fontWeight: 700,
fontWeight: 500,
}}
>
{opt.badge}

72
packages/ui/src/theme.ts
View file

@ -459,9 +459,13 @@ export const d3roPalette = {
},
} as const
// 한글 우선 폰트 스택 — Pretendard(한/영 조화) → 플랫폼 한글 시스템 폰트 폴백.
// 웨이트는 Pretendard Variable(45-920) 기준. 폴백 시스템 폰트에 없는 굵기는
// 브라우저가 합성하므로 400/500/600 범위로만 사용한다 (W3C klreq 권장 범위).
export const d3roFontSans = [
'"Pretendard Variable"', 'Pretendard', '-apple-system', 'BlinkMacSystemFont',
'"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif',
'"Apple SD Gothic Neo"', '"Noto Sans KR"', '"Segoe UI"', 'Roboto',
'"Helvetica Neue"', 'Arial', '"Malgun Gothic"', 'sans-serif',
].join(',')
export const d3roFontMono = [
@ -470,20 +474,27 @@ export const d3roFontMono = [
].join(',')
// ── SSOT: 타이포그래피 토큰 ─────────────────────────────
// v2: 클린 산세리프(Pretendard) 기반, 굵은 헤드라인 + 큰 수치
// v3 "타이포그래피 퍼스트": 볼드(700+)를 제거하고 크기·행간·명도로 위계를 만든다.
// 근거 (W3C klreq / 요즘IT DS / KRDS):
// - 한글은 낱글자가 사각 블록이라 라틴보다 시각 밀도가 높다 → 600 이상은 과중.
// 헤드라인은 500, 몸통 400, 라벨 500으로 충분하다.
// - 한글 행간은 1.5~1.7 (블록 글자의 숨 쉬는 공간). 헤드라인도 1.2 이상.
// - 한글 자간 0 근처. 음수 트래킹은 대형 라틴 헤드라인에만 -0.01~-0.02em.
// - 양수 트래킹(+0.02~0.04em)은 라틴 대문자 라벨에만. 한글엔 적용하지 않는다.
// - 한글 최소 11px (획이 뭉개지는 하한). 8-9px 토큰은 폐기하고 상향.
export const d3roTypo = {
hero: { size: '32px', weight: 700, spacing: '-0.5px', line: 1.2 },
title: { size: '24px', weight: 700, spacing: '-0.3px', line: 1.25 },
value: { size: '20px', weight: 600, spacing: '0', line: 1.1 },
heading: { size: '16px', weight: 600, spacing: '0', line: 1.4 },
body: { size: '14px', weight: 400, spacing: '0', line: 1.55 },
compact: { size: '13px', weight: 400, spacing: '0', line: 1.5 },
small: { size: '12px', weight: 500, spacing: '0.01em', line: 1.4 },
meta: { size: '11px', weight: 600, spacing: '0.04em', line: 1.3 },
label: { size: '11px', weight: 600, spacing: '0.08em', line: 1.2 },
engrave: { size: '9px', weight: 700, spacing: '1px', line: 1 },
micro: { size: '9px', weight: 700, spacing: '1px', line: 1 },
nano: { size: '8px', weight: 700, spacing: '0.5px', line: 1 },
hero: { size: '32px', weight: 500, spacing: '-0.02em', line: 1.3 },
title: { size: '24px', weight: 500, spacing: '-0.01em', line: 1.35 },
value: { size: '20px', weight: 500, spacing: '0', line: 1.2 },
heading: { size: '16px', weight: 500, spacing: '0', line: 1.5 },
body: { size: '14px', weight: 400, spacing: '0', line: 1.6 },
compact: { size: '13px', weight: 400, spacing: '0', line: 1.55 },
small: { size: '12px', weight: 400, spacing: '0', line: 1.45 },
meta: { size: '11px', weight: 500, spacing: '0.02em', line: 1.35 },
label: { size: '11px', weight: 500, spacing: '0.04em', line: 1.3 },
engrave: { size: '10px', weight: 500, spacing: '0.06em', line: 1.2 },
micro: { size: '10px', weight: 500, spacing: '0.04em', line: 1.2 },
nano: { size: '9px', weight: 500, spacing: '0.03em', line: 1.15 },
} as const
/**
@ -601,6 +612,12 @@ function buildCssVars(key: ThemeKey): Record<string, string> {
'--d3-glow-soft': r.glow.soft,
'--d3-glow-card': r.glow.card,
'--d3-glow-cardHover': r.glow.cardHover,
// 시맨틱 태그색 (테마 불변) — color-mix 틴트 파생용
'--d3-tag-purple': d3roPalette.tag.purple,
'--d3-tag-orange': d3roPalette.tag.orange,
'--d3-tag-red': d3roPalette.tag.red,
'--d3-tag-green': d3roPalette.tag.green,
'--d3-tag-blue': d3roPalette.tag.blue,
}
}
@ -631,15 +648,16 @@ function createD3ROTheme(key: ThemeKey): Theme {
},
typography: {
fontFamily: d3roFontSans,
h4: { fontWeight: 700, fontSize: '22px', lineHeight: 1.3 },
h5: { fontWeight: 700, fontSize: '18px', lineHeight: 1.4 },
h6: { fontWeight: 600, fontSize: '14px', lineHeight: 1.5 },
subtitle1: { fontWeight: 500, fontSize: '18px', lineHeight: 1.4 },
body1: { fontSize: '14px', lineHeight: 1.5 },
body2: { fontSize: '12px', lineHeight: 1.4 },
button: { textTransform: 'none' as const, fontWeight: 600, fontSize: '14px' },
caption: { fontSize: '11px', fontWeight: 600, letterSpacing: '0.06em', color: r.text.label },
overline: { fontSize: '11px', fontWeight: 600, letterSpacing: '0.08em', textTransform: 'uppercase' as const, lineHeight: 1.2 },
// v3: 헤드라인 500 — 볼드가 아닌 크기와 명도로 위계 (한글 과중 방지)
h4: { fontWeight: 500, fontSize: '22px', lineHeight: 1.35 },
h5: { fontWeight: 500, fontSize: '18px', lineHeight: 1.45 },
h6: { fontWeight: 500, fontSize: '14px', lineHeight: 1.5 },
subtitle1: { fontWeight: 500, fontSize: '18px', lineHeight: 1.45 },
body1: { fontSize: '14px', lineHeight: 1.6 },
body2: { fontSize: '12px', lineHeight: 1.5 },
button: { textTransform: 'none' as const, fontWeight: 500, fontSize: '14px' },
caption: { fontSize: '11px', fontWeight: 500, letterSpacing: '0.02em', color: r.text.label },
overline: { fontSize: '11px', fontWeight: 500, letterSpacing: '0.04em', textTransform: 'uppercase' as const, lineHeight: 1.3 },
},
shape: { borderRadius: 16 },
components: {
@ -656,7 +674,7 @@ function createD3ROTheme(key: ThemeKey): Theme {
defaultProps: { disableElevation: true },
styleOverrides: {
root: {
textTransform: 'none', fontWeight: 600, borderRadius: 10, padding: '10px 20px',
textTransform: 'none', fontWeight: 500, borderRadius: 10, padding: '10px 20px',
transition: 'filter 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease',
},
containedPrimary: {
@ -711,7 +729,7 @@ function createD3ROTheme(key: ThemeKey): Theme {
},
MuiChip: {
styleOverrides: {
root: { borderRadius: 999, fontWeight: 600, fontSize: '11px', letterSpacing: '0.04em', height: 24 },
root: { borderRadius: 999, fontWeight: 500, fontSize: '11px', letterSpacing: '0.02em', height: 24 },
colorPrimary: { backgroundColor: accentDim, color: accentLight },
colorSecondary: { backgroundColor: d3roPalette.tag.purpleBg, color: d3roPalette.tag.purple },
colorSuccess: { backgroundColor: d3roPalette.tag.greenBg, color: d3roPalette.tag.green },
@ -724,7 +742,7 @@ function createD3ROTheme(key: ThemeKey): Theme {
styleOverrides: {
root: {
borderRadius: 12, marginLeft: 8, marginRight: 8,
'&.Mui-selected': { backgroundColor: accentDim, color: accentLight, fontWeight: 600, '&:hover': { backgroundColor: accentDim } },
'&.Mui-selected': { backgroundColor: accentDim, color: accentLight, fontWeight: 500, '&:hover': { backgroundColor: accentDim } },
},
},
},
@ -801,7 +819,7 @@ function createD3ROTheme(key: ThemeKey): Theme {
},
},
MuiTabs: { styleOverrides: { indicator: { backgroundColor: accentMain, height: 2, borderRadius: 2 } } },
MuiTab: { styleOverrides: { root: { textTransform: 'none', fontWeight: 500, fontSize: '14px', '&.Mui-selected': { color: accentLight, fontWeight: 600 } } } },
MuiTab: { styleOverrides: { root: { textTransform: 'none', fontWeight: 500, fontSize: '14px', '&.Mui-selected': { color: accentLight, fontWeight: 500 } } } },
MuiPaper: {
styleOverrides: {
root: { backgroundImage: 'none' },