sh-ui-cli 0.68.0 → 0.68.1

package/data/changelog/versions.json

@@ -2,6 +2,21 @@
   "$schema": "https://json-schema.org/draft/2020-12/schema",
   "$description": "sh-ui 릴리즈 노트 단일 소스. docs(React)와 showcase(Flutter)가 함께 읽는다. 새 릴리즈마다 맨 앞에 추가.",
   "versions": [
+    {
+      "version": "0.68.1",
+      "date": "2026-05-09",
+      "title": "fix(tokens) — --ring / --danger-hover / --shadow-menu 정식 등록 (Phase A 후속)",
+      "type": "patch",
+      "highlights": [
+        "**`--ring` 토큰 신설** — 58 개 컴포넌트가 focus outline 으로 사용하던 변수가 미정의였음 (시각적으로 outline 색이 빈 값으로 들어가 거의 안 보이던 silent breakage). v0.68.0 doctor 가 발견. 이번 릴리즈로 light=neutral.400 / dark=neutral.500 (preset 별 derive) 으로 정식 매핑.",
+        "**`--danger-hover` 토큰 신설** — Button danger 변종 hover 색 변화가 없던 silent breakage. light=red.700 / dark=red.500 추가, 기존 `--danger` 와 자연스러운 진/연 차이.",
+        "**`--shadow-menu` 토큰 의미화** — DropdownMenu / Select / ContextMenu 그림자. 이전엔 inject 단계 hardcode 였는데 semantic.json 의 `{shadow.lg}` 참조로 정식화 — `sh-ui add tokens` (buildTokens 경로) 와 `sh-ui create` (inject 경로) 둘 다 동일하게 emit.",
+        "**Flutter 측 `ShUiColorTokens.ring` / `.dangerHover` 필드 추가** — DART_FIELD_SOURCES 에 `fallback` 메타 추가, 옛 base64 theme 처럼 키가 누락된 경우 `danger` / `foreground-subtle` 로 안전하게 폴백. 기존 `sh_ui_encode_theme` 산출물도 깨지지 않음.",
+        "**옵셔널 키 정책** — `ring`, `danger-hover` 는 OPTIONAL_TOKEN_KEYS 로 등록. light/dark 모두 정의된 preset 만 inject 시 emit (NEUTRAL/slate 정식 정의, rose/emerald/violet 은 NEUTRAL spread 로 자동 상속). 옛 base64 theme 디코드는 strict 검증을 우회해 backward 호환.",
+        "**v0.68.0 doctor 가 즉시 활용** — fresh `sh-ui create` + `sh-ui doctor` 가 ✓ 모든 검사 통과."
+      ],
+      "url": "https://github.com/sanghyeonKim0201/sh-ui/releases/tag/v0.68.1"
+    },
     {
       "version": "0.68.0",
       "date": "2026-05-09",

package/data/registry/flutter/foundation/sh_ui_tokens.dart

@@ -20,6 +20,8 @@ class ShUiColorTokens {
   final Color primaryHover;
   final Color danger;
   final Color dangerForeground;
+  final Color dangerHover;
+  final Color ring;
 
   const ShUiColorTokens({
     required this.background,
@@ -37,6 +39,8 @@ class ShUiColorTokens {
     required this.primaryHover,
     required this.danger,
     required this.dangerForeground,
+    required this.dangerHover,
+    required this.ring,
   });
 
   static const light = ShUiColorTokens(
@@ -55,6 +59,8 @@ class ShUiColorTokens {
     primaryHover: Color(0xFF262626),
     danger: Color(0xFFDC2626),
     dangerForeground: Color(0xFFFFFFFF),
+    dangerHover: Color(0xFFB91C1C),
+    ring: Color(0xFFA3A3A3),
   );
 
   static const dark = ShUiColorTokens(
@@ -73,6 +79,8 @@ class ShUiColorTokens {
     primaryHover: Color(0xFFE5E5E5),
     danger: Color(0xFFDC2626),
     dangerForeground: Color(0xFFFFFFFF),
+    dangerHover: Color(0xFFEF4444),
+    ring: Color(0xFF737373),
   );
 }
 
@@ -194,12 +202,14 @@ class ShUiShadowTokens {
   final List<BoxShadow> md;
   final List<BoxShadow> lg;
   final List<BoxShadow> xl;
+  final List<BoxShadow> menu;
 
   const ShUiShadowTokens({
     required this.sm,
     required this.md,
     required this.lg,
     required this.xl,
+    required this.menu,
   });
 
   static const tokens = ShUiShadowTokens(
@@ -207,6 +217,7 @@ class ShUiShadowTokens {
     md: <BoxShadow>[BoxShadow(offset: Offset(0.0, 4.0), blurRadius: 12.0, spreadRadius: 0.0, color: Color(0x1F000000))],
     lg: <BoxShadow>[BoxShadow(offset: Offset(0.0, 8.0), blurRadius: 24.0, spreadRadius: 0.0, color: Color(0x26000000))],
     xl: <BoxShadow>[BoxShadow(offset: Offset(0.0, 16.0), blurRadius: 48.0, spreadRadius: 0.0, color: Color(0x2E000000))],
+    menu: <BoxShadow>[BoxShadow(offset: Offset(0.0, 8.0), blurRadius: 24.0, spreadRadius: 0.0, color: Color(0x26000000))],
   );
 }
 

package/data/tokens/src/primitives.json

@@ -48,7 +48,8 @@
 
     "red": {
       "500": { "$value": "#EF4444", "$type": "color" },
-      "600": { "$value": "#DC2626", "$type": "color" }
+      "600": { "$value": "#DC2626", "$type": "color" },
+      "700": { "$value": "#B91C1C", "$type": "color" }
     }
   },
 

package/data/tokens/src/semantic.json

@@ -25,8 +25,10 @@
     },
     "danger": {
       "default":    { "$value": "{color.red.600}", "$type": "color" },
-      "foreground": { "$value": "{color.white}", "$type": "color" }
-    }
+      "foreground": { "$value": "{color.white}", "$type": "color" },
+      "hover":      { "$value": "{color.red.700}", "$type": "color" }
+    },
+    "ring": { "$value": "{color.{base}.400}", "$type": "color" }
   },
 
   "dark": {
@@ -53,8 +55,10 @@
     },
     "danger": {
       "default":    { "$value": "{color.red.600}", "$type": "color" },
-      "foreground": { "$value": "{color.white}", "$type": "color" }
-    }
+      "foreground": { "$value": "{color.white}", "$type": "color" },
+      "hover":      { "$value": "{color.red.500}", "$type": "color" }
+    },
+    "ring": { "$value": "{color.{base}.500}", "$type": "color" }
   },
 
   "radius": {
@@ -94,10 +98,11 @@
   },
 
   "shadow": {
-    "sm": { "$value": "{shadow.sm}", "$type": "shadow" },
-    "md": { "$value": "{shadow.md}", "$type": "shadow" },
-    "lg": { "$value": "{shadow.lg}", "$type": "shadow" },
-    "xl": { "$value": "{shadow.xl}", "$type": "shadow" }
+    "sm":   { "$value": "{shadow.sm}", "$type": "shadow" },
+    "md":   { "$value": "{shadow.md}", "$type": "shadow" },
+    "lg":   { "$value": "{shadow.lg}", "$type": "shadow" },
+    "xl":   { "$value": "{shadow.xl}", "$type": "shadow" },
+    "menu": { "$value": "{shadow.lg}", "$type": "shadow" }
   },
 
   "duration": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sh-ui-cli",
-  "version": "0.68.0",
+  "version": "0.68.1",
   "description": "sh-ui CLI — 프로젝트 스캐폴드(create) + 컴포넌트 추가(add/list/remove) + IDE-내 AI용 MCP 서버",
   "license": "MIT",
   "repository": {

package/src/create/theme/decode.js

@@ -10,11 +10,15 @@ const TOKEN_KEYS = [
 
 // 옵셔널 색 토큰 — 누락 OK. 입력에 들어 있으면 hex 검증 + inject 시 CSS 변수로 emit.
 // 사용자가 success/warning/info 상태 컬러를 커스텀하고 싶을 때 사용.
-// Dart 측 ShUiColorTokens 는 아직 미반영(웹 한정).
+// v0.68.1+ 부터 ring / danger-hover 도 옵셔널로 — 기존 base64 theme 은 누락된 상태로
+// 디코드되고, 신규 preset 은 light/dark 모두 정의해 inject 가 emit (DART 도 OPTIONAL 키
+// 가 light/dark 양쪽에 있으면 ShUiColorTokens 의 ring/dangerHover 필드에 자동 매핑).
 const OPTIONAL_TOKEN_KEYS = [
   'success', 'success-foreground',
   'warning', 'warning-foreground',
   'info', 'info-foreground',
+  'danger-hover',
+  'ring',
 ];
 
 /**

package/src/create/theme/inject.js

@@ -92,12 +92,20 @@ const DART_FIELD_SOURCES = [
   { field: 'primaryHover',         key: 'primary-hover' },
   { field: 'danger',               key: 'danger' },
   { field: 'dangerForeground',     key: 'danger-foreground' },
+  // 아래 둘은 v0.68.1+ 신설. theme 객체에 없으면 fallback 키의 값으로 안전하게 채움 —
+  // 기존 base64 테마(이전 버전이 만든 것)도 깨지지 않도록.
+  { field: 'dangerHover',          key: 'danger-hover', fallback: 'danger' },
+  { field: 'ring',                 key: 'ring',         fallback: 'foreground-subtle' },
 ];
 
 const buildDartStaticConst = (mode, self) => {
-  const lines = DART_FIELD_SOURCES.map(({ field, key }) =>
-    `    ${field}: ${toDartColor(self[key])},`,
-  ).join('\n');
+  const lines = DART_FIELD_SOURCES.map(({ field, key, fallback }) => {
+    const value = self[key] ?? (fallback ? self[fallback] : undefined);
+    if (!value) {
+      throw new Error(`inject: ${mode}.${key} 누락 (fallback ${fallback ?? '없음'} 도 없음)`);
+    }
+    return `    ${field}: ${toDartColor(value)},`;
+  }).join('\n');
   return [
     `  static const ${mode} = ShUiColorTokens(`,
     lines,

package/src/create/theme/presets.js

@@ -22,6 +22,8 @@ const NEUTRAL_LIGHT = {
   'primary-hover': '#262626',
   'danger': '#DC2626',
   'danger-foreground': '#FFFFFF',
+  'danger-hover': '#B91C1C',
+  'ring': '#A3A3A3',
 };
 
 const NEUTRAL_DARK = {
@@ -40,6 +42,8 @@ const NEUTRAL_DARK = {
   'primary-hover': '#E5E5E5',
   'danger': '#DC2626',
   'danger-foreground': '#FFFFFF',
+  'danger-hover': '#EF4444',
+  'ring': '#737373',
 };
 
 export const THEME_PRESETS = {
@@ -67,6 +71,8 @@ export const THEME_PRESETS = {
       'primary-hover': '#4338CA',
       'danger': '#DC2626',
       'danger-foreground': '#FFFFFF',
+      'danger-hover': '#B91C1C',
+      'ring': '#94A3B8',
     },
     dark: {
       'background': '#0F172A',
@@ -84,6 +90,8 @@ export const THEME_PRESETS = {
       'primary-hover': '#A5B4FC',
       'danger': '#F87171',
       'danger-foreground': '#450A0A',
+      'danger-hover': '#FCA5A5',
+      'ring': '#64748B',
     },
     radius: 0.375,
     // 정보 밀도 ↑ — 본문 14px 부터, 컨트롤 36px (대시보드/관리자 인상)

package/templates/flutter-standalone/lib/sh_ui/foundation/sh_ui_tokens.dart

@@ -20,6 +20,8 @@ class ShUiColorTokens {
   final Color primaryHover;
   final Color danger;
   final Color dangerForeground;
+  final Color dangerHover;
+  final Color ring;
 
   const ShUiColorTokens({
     required this.background,
@@ -37,6 +39,8 @@ class ShUiColorTokens {
     required this.primaryHover,
     required this.danger,
     required this.dangerForeground,
+    required this.dangerHover,
+    required this.ring,
   });
 
   // sh-ui:theme-colors-start
@@ -56,6 +60,8 @@ class ShUiColorTokens {
     primaryHover: Color(0xFF262626),
     danger: Color(0xFFDC2626),
     dangerForeground: Color(0xFFFFFFFF),
+    dangerHover: Color(0xFFB91C1C),
+    ring: Color(0xFFA3A3A3),
   );
 
   static const dark = ShUiColorTokens(
@@ -74,6 +80,8 @@ class ShUiColorTokens {
     primaryHover: Color(0xFFE5E5E5),
     danger: Color(0xFFDC2626),
     dangerForeground: Color(0xFFFFFFFF),
+    dangerHover: Color(0xFFEF4444),
+    ring: Color(0xFF737373),
   );
   // sh-ui:theme-colors-end
 }