sh-ui-cli 0.59.8 → 0.61.0

package/data/changelog/versions.json

@@ -2,6 +2,59 @@
   "$schema": "https://json-schema.org/draft/2020-12/schema",
   "$description": "sh-ui 릴리즈 노트 단일 소스. docs(React)와 showcase(Flutter)가 함께 읽는다. 새 릴리즈마다 맨 앞에 추가.",
   "versions": [
+    {
+      "version": "0.61.0",
+      "date": "2026-05-07",
+      "title": "create CLI 대규모 정비 — cssFramework 진짜 분기 + i18n hooks + 49건 결함 수정",
+      "type": "minor",
+      "highlights": [
+        "**`--css plain` / `--css css-modules` 가 진짜로 분기 emit** — 이전엔 `sh-ui.config.json` 의 cssFramework 필드만 바뀌고 페이지/스타일은 모두 Tailwind 동일했음. 이제 plain 은 `tailwindcss` 의존 없음 + `page.tsx` 가 inline style, css-modules 는 `page.module.css` + class import. sentry 의 `error.tsx`, monorepo root `.prettierrc` / `package.json` 까지 cssFramework 별로 정리.",
+        "**i18n-aware 포맷 hook + error code mapping 신규** — next-intl 활성 시 `useFormatDate()` / `useFormatPrice(currency)` hook emit (현재 locale 자동). 새 `errorMessages.ts` + `resolveErrorMessage()` 가 backend raw 메시지 직접 노출 대신 코드별 안전 메시지로 변환. `useAppMutation` 이 자동 사용.",
+        "**플러그인 emit 결함 일괄 수정** — auth-jwt 가 redirect 만 시키고 sign-in 페이지를 안 만들어 무한 404 루프에 빠지던 문제 (placeholder 페이지 emit). `[locale]/error.tsx` 가 i18n messages 를 사용 안 해 dead code 였던 것 (`useTranslations` + `Link` from i18n navigation). `clientFetch` 의 `/sign-in` redirect 가 locale prefix 무시해 루프 위험이던 것 (regex 매칭).",
+        "**fs-extra → Node native fs/promises 마이그레이션** — long-running MCP daemon 환경에서 fs-extra v11 의 internal state 누적으로 `fs.copy` filter 가 부분 실패하던 회귀를 native `fs.cp` 로 우회. `ensureArchCleanup` + `assertArchOverlayApplied` invariant 가드 추가.",
+        "**작은 정리 모음** — `.eslintrc.js` (legacy ESLint 8) 제거, `Dockerfile` multi-stage build 로 교체, `getQueryClient` default → named export, `ThemeProviders` → `ThemeProvider` rename, deps 알파벳 정렬, flat arch 전용 `eslint-config/flat` 신설, Flutter `sh-ui.config.json` 의 의미 없는 `cssFramework` 필드 제거. 96 combo install + typecheck + build 회귀 가드 통과."
+      ],
+      "url": "https://github.com/sanghyeonKim0201/sh-ui/releases/tag/v0.61.0"
+    },
+    {
+      "version": "0.60.0",
+      "date": "2026-05-06",
+      "title": "BREAKING — PasswordInput 제거, InputGroup 레시피로 강등",
+      "type": "minor",
+      "highlights": [
+        "**`PasswordInput` (React) / `ShUiPasswordInput` (Flutter) export 제거** — 표시/숨김 토글만 들어 있던 얇은 wrapper 였고, 아이콘 교체·왼쪽 자물쇠 같은 변형 요청을 받기 시작하면 prop 폭발 → `InputGroup` + `InputAdornment` 합성으로 대체.",
+        "**Input 페이지 신규 섹션 “비밀번호 토글 (레시피)”** — 우측 눈 아이콘 / 좌측 자물쇠 + 우측 토글 두 가지 라이브 데모. `aria-pressed`, `tabIndex={-1}`, `InputAdornment interactive` 등 a11y 디테일을 그대로 노출해 사용자가 자신의 코드로 복사해 자유롭게 변형.",
+        "**마이그레이션** — `<PasswordInput placeholder=\"…\" />` → `<Input type=\"password\" placeholder=\"…\" />` (단순 비밀번호 입력) 또는 docs 의 InputGroup 레시피를 복붙(토글이 필요한 경우). Flutter 는 `ShUiInput(obscureText: true)`.",
+        "**왜 컴포넌트가 아니라 레시피인가** — 토글 자체에는 알고리즘 가치가 없고 사용자마다 아이콘·위치·동작 요구가 갈린다. 같은 모듈의 NumberInput / PhoneInput / BusinessNumberInput 은 포맷·체크섬 로직이 자산이라 컴포넌트로 유지."
+      ],
+      "url": "https://github.com/sanghyeonKim0201/sh-ui/releases/tag/v0.60.0"
+    },
+    {
+      "version": "0.59.10",
+      "date": "2026-05-06",
+      "title": "fix — docs 우측 TOC · 사이드바 active 하이라이트 (i18n locale prefix)",
+      "type": "patch",
+      "highlights": [
+        "**우측 목차(TOC)가 컴포넌트 페이지에서 사라진 문제 수정** — i18n 도입 후 `usePathname()` 이 `/en/components/...` / `/ko/components/...` 를 반환하는데, `TocSlot` 가드가 여전히 `/components/` prefix 만 검사해 항상 false → TOC 가 mount 되지 않았다.",
+        "**사이드바 active 하이라이트 동시 복구** — `app-sidebar.tsx` 의 `componentsActive` / `pluginsActive` / `architecturesActive` 와 `isActive(href)` 모두 raw pathname 으로 비교하던 걸 locale prefix 를 벗긴 `withoutLocale` 기준으로 통일.",
+        "**가드 방식** — `pathname.replace(/^\\/[a-z]{2}(?=\\/|$)/, \"\")` 로 두 글자 locale 코드만 안전하게 제거 (`/en` / `/ko` 외 라우트는 그대로 통과).",
+        "**검증** — `/ko/components/button`, `/en/components/card`, `/ko/architectures/fsd` 세 경로에서 TOC 표시 여부와 사이드바 `data-active` 가 의도대로 동작하는지 브라우저로 확인."
+      ],
+      "url": "https://github.com/sanghyeonKim0201/sh-ui/releases/tag/v0.59.10"
+    },
+    {
+      "version": "0.59.9",
+      "date": "2026-05-06",
+      "title": "fix — next-intl standalone 빌드 (globals.css 상대 경로 보정)",
+      "type": "patch",
+      "highlights": [
+        "**`sh-ui-cli create --plugins next-intl --structure standalone` prod 빌드 폭발 수정** — next-intl 플러그인이 `app/layout.tsx` 를 `app/[locale]/layout.tsx` 로 이동하면서 보존하는 side-effect import (`import './globals.css';`) 의 상대 경로를 보정하지 않아, 한 단계 깊어진 새 위치에서 `./globals.css` 가 미해결 모듈이 됐다. `pnpm build` (`next build`) 가 `Module not found: Can't resolve './globals.css'` 로 실패.",
+        "**경로 보정** — `nextIntl.js` 의 `contentFn` 에서 보존되는 side-effect import 의 `./` / `../` 접두사를 디렉토리 깊이 변화(1단계)만큼 끌어올림. 절대 경로(`/x`) 와 모듈명(`polyfills`) 은 그대로.",
+        "**회귀 가드 강화** — smoke 시나리오 3 의 globals.css 검사가 `/[^'\"]*globals\\.css/` 단순 존재만 봤어서 v0.59.8 까지 누락. `import '../globals.css';` 정확 매치 + `import './globals.css';` 부재로 강화.",
+        "**전수 검증** — 36-combo 스캐폴드 매트릭스(structure × arch × css × plugins) 의 standalone+all-plugins 6 케이스 모두 fix 후 prod 빌드 성공 확인. monorepo+all-plugins 는 원래부터 정상."
+      ],
+      "url": "https://github.com/sanghyeonKim0201/sh-ui/releases/tag/v0.59.9"
+    },
     {
       "version": "0.59.8",
       "date": "2026-05-06",

package/data/registry/flutter/widgets/sh_ui_input.dart

@@ -158,85 +158,6 @@ class _ShUiInputState extends State<ShUiInput> {
   }
 }
 
-/* ───────── ShUiPasswordInput ───────── */
-
-class ShUiPasswordInput extends StatefulWidget {
-  final TextEditingController? controller;
-  final String? placeholder;
-  final bool enabled;
-  final bool invalid;
-  final bool hideToggle;
-  final ValueChanged<String>? onChanged;
-  final ValueChanged<String>? onSubmitted;
-  final FocusNode? focusNode;
-
-  const ShUiPasswordInput({
-    super.key,
-    this.controller,
-    this.placeholder,
-    this.enabled = true,
-    this.invalid = false,
-    this.hideToggle = false,
-    this.onChanged,
-    this.onSubmitted,
-    this.focusNode,
-  });
-
-  @override
-  State<ShUiPasswordInput> createState() => _ShUiPasswordInputState();
-}
-
-class _ShUiPasswordInputState extends State<ShUiPasswordInput> {
-  bool _visible = false;
-
-  @override
-  Widget build(BuildContext context) {
-    return ShUiInput(
-      controller: widget.controller,
-      placeholder: widget.placeholder,
-      enabled: widget.enabled,
-      invalid: widget.invalid,
-      obscureText: !_visible,
-      onChanged: widget.onChanged,
-      onSubmitted: widget.onSubmitted,
-      focusNode: widget.focusNode,
-      suffix: widget.hideToggle
-          ? null
-          : _ToggleButton(
-              visible: _visible,
-              onToggle: () => setState(() => _visible = !_visible),
-            ),
-    );
-  }
-}
-
-class _ToggleButton extends StatelessWidget {
-  final bool visible;
-  final VoidCallback onToggle;
-  const _ToggleButton({required this.visible, required this.onToggle});
-
-  @override
-  Widget build(BuildContext context) {
-    final shUi = Theme.of(context).extension<ShUiTheme>() ?? ShUiTheme.light;
-    return Semantics(
-      button: true,
-      label: visible ? '비밀번호 숨기기' : '비밀번호 표시',
-      child: InkWell(
-        onTap: onToggle,
-        borderRadius: BorderRadius.circular(shUi.radius.defaultRadius - 2),
-        child: Padding(
-          padding: EdgeInsets.all(shUi.spacing.s2),
-          child: Icon(
-            visible ? Icons.visibility_off_outlined : Icons.visibility_outlined,
-            size: 18,
-            color: shUi.colors.foregroundMuted,
-          ),
-        ),
-      ),
-    );
-  }
-}
-
 /* ───────── ShUiNumberInput ─────────
  * 정수 입력 + 천 단위 콤마(옵션). onChanged는 num? 콜백.
  * blur 시 min/max로 clamp.

package/data/registry/react/components/input/index.module.tsx

@@ -158,76 +158,6 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>(
 );
 Input.displayName = "Input";
 
-/* ───────── PasswordInput ───────── */
-
-function EyeIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path
-        d="M2 10s3-5.5 8-5.5S18 10 18 10s-3 5.5-8 5.5S2 10 2 10Z"
-        stroke="currentColor"
-        strokeWidth="1.5"
-      />
-      <circle cx="10" cy="10" r="2.25" stroke="currentColor" strokeWidth="1.5" />
-    </svg>
-  );
-}
-
-function EyeOffIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path
-        d="M3 3l14 14M8 5a8 8 0 0 1 2-.3c5 0 8 5.3 8 5.3a13 13 0 0 1-2.3 2.9M12 12a2.5 2.5 0 0 1-3.4-3.4m-2.3-2.5A13 13 0 0 0 2 10s3 5.5 8 5.5a8 8 0 0 0 3.3-.7"
-        stroke="currentColor"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-      />
-    </svg>
-  );
-}
-
-export interface PasswordInputProps extends Omit<InputProps, "type" | "suffix"> {
-  /**
-   * 비밀번호 표시 토글 버튼을 숨긴다. 비밀번호를 절대 노출하면 안 되는 화면(결제 등)에서 사용.
-   *
-   * @default false
-   */
-  hideToggle?: boolean;
-}
-
-/**
- * 비밀번호 입력. 기본으로 표시 토글 버튼이 suffix에 부착되며 `hideToggle`로 숨길 수 있다.
- * 토글은 `aria-pressed`로 상태가 노출되고 Tab 흐름에서 제외(`tabIndex=-1`)된다.
- */
-export const PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(
-  ({ hideToggle, ...props }, ref) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const toggle = hideToggle ? undefined : (
-      <button
-        type="button"
-        className={styles.toggle}
-        onClick={() => setVisible((v) => !v)}
-        aria-label={visible ? "비밀번호 숨기기" : "비밀번호 표시"}
-        aria-pressed={visible}
-        tabIndex={-1}
-      >
-        {visible ? <EyeOffIcon /> : <EyeIcon />}
-      </button>
-    );
-
-    return (
-      <Input
-        ref={ref}
-        type={visible ? "text" : "password"}
-        suffix={toggle}
-        {...props}
-      />
-    );
-  },
-);
-PasswordInput.displayName = "PasswordInput";
-
 /* ───────── NumberInput ─────────
  * 정수 입력 + 천 단위 콤마(옵션). value/onValueChange는 number | undefined.
  */

package/data/registry/react/components/input/index.tailwind.tsx

@@ -146,59 +146,6 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>(
 );
 Input.displayName = "Input";
 
-/* ───────── PasswordInput ───────── */
-
-const passwordToggleClasses =
-  "inline-flex items-center justify-center w-8 h-8 p-0 bg-transparent border-none rounded-[calc(var(--radius)-2px)] text-foreground-muted cursor-pointer transition-[color,background-color] duration-[var(--duration-fast)] hover:text-foreground hover:bg-background-muted focus-visible:outline-[length:var(--border-width-strong)] focus-visible:outline-ring focus-visible:outline-offset-2";
-
-function EyeIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path d="M2 10s3-5.5 8-5.5S18 10 18 10s-3 5.5-8 5.5S2 10 2 10Z" stroke="currentColor" strokeWidth="1.5" />
-      <circle cx="10" cy="10" r="2.25" stroke="currentColor" strokeWidth="1.5" />
-    </svg>
-  );
-}
-
-function EyeOffIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path
-        d="M3 3l14 14M8 5a8 8 0 0 1 2-.3c5 0 8 5.3 8 5.3a13 13 0 0 1-2.3 2.9M12 12a2.5 2.5 0 0 1-3.4-3.4m-2.3-2.5A13 13 0 0 0 2 10s3 5.5 8 5.5a8 8 0 0 0 3.3-.7"
-        stroke="currentColor"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-      />
-    </svg>
-  );
-}
-
-export interface PasswordInputProps extends Omit<InputProps, "type" | "suffix"> {
-  hideToggle?: boolean;
-}
-
-export const PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(
-  ({ hideToggle, ...props }, ref) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const toggle = hideToggle ? undefined : (
-      <button
-        type="button"
-        className={passwordToggleClasses}
-        onClick={() => setVisible((v) => !v)}
-        aria-label={visible ? "비밀번호 숨기기" : "비밀번호 표시"}
-        aria-pressed={visible}
-        tabIndex={-1}
-      >
-        {visible ? <EyeOffIcon /> : <EyeIcon />}
-      </button>
-    );
-
-    return <Input ref={ref} type={visible ? "text" : "password"} suffix={toggle} {...props} />;
-  },
-);
-PasswordInput.displayName = "PasswordInput";
-
 /* ───────── NumberInput / PhoneInput / BusinessNumberInput
  * 이 세 컴포넌트는 Input 을 wrap 만 — 자체 className 사용 안 함.
  * plain 변종과 동일한 로직을 그대로 노출. */

package/data/registry/react/components/input/index.tsx

@@ -165,76 +165,6 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>(
 );
 Input.displayName = "Input";
 
-/* ───────── PasswordInput ───────── */
-
-function EyeIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path
-        d="M2 10s3-5.5 8-5.5S18 10 18 10s-3 5.5-8 5.5S2 10 2 10Z"
-        stroke="currentColor"
-        strokeWidth="1.5"
-      />
-      <circle cx="10" cy="10" r="2.25" stroke="currentColor" strokeWidth="1.5" />
-    </svg>
-  );
-}
-
-function EyeOffIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path
-        d="M3 3l14 14M8 5a8 8 0 0 1 2-.3c5 0 8 5.3 8 5.3a13 13 0 0 1-2.3 2.9M12 12a2.5 2.5 0 0 1-3.4-3.4m-2.3-2.5A13 13 0 0 0 2 10s3 5.5 8 5.5a8 8 0 0 0 3.3-.7"
-        stroke="currentColor"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-      />
-    </svg>
-  );
-}
-
-export interface PasswordInputProps extends Omit<InputProps, "type" | "suffix"> {
-  /**
-   * 비밀번호 표시 토글 버튼을 숨긴다. 비밀번호를 절대 노출하면 안 되는 화면(결제 등)에서 사용.
-   *
-   * @default false
-   */
-  hideToggle?: boolean;
-}
-
-/**
- * 비밀번호 입력. 기본으로 표시 토글 버튼이 suffix에 부착되며 `hideToggle`로 숨길 수 있다.
- * 토글은 `aria-pressed`로 상태가 노출되고 Tab 흐름에서 제외(`tabIndex=-1`)된다.
- */
-export const PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(
-  ({ hideToggle, ...props }, ref) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const toggle = hideToggle ? undefined : (
-      <button
-        type="button"
-        className="sh-ui-input__toggle"
-        onClick={() => setVisible((v) => !v)}
-        aria-label={visible ? "비밀번호 숨기기" : "비밀번호 표시"}
-        aria-pressed={visible}
-        tabIndex={-1}
-      >
-        {visible ? <EyeOffIcon /> : <EyeIcon />}
-      </button>
-    );
-
-    return (
-      <Input
-        ref={ref}
-        type={visible ? "text" : "password"}
-        suffix={toggle}
-        {...props}
-      />
-    );
-  },
-);
-PasswordInput.displayName = "PasswordInput";
-
 /* ───────── NumberInput ─────────
  * 정수 입력 + 천 단위 콤마(옵션). value/onValueChange는 number | undefined.
  */

package/data/registry/react/components/input/index.vanilla-extract.tsx

@@ -10,7 +10,6 @@ import {
   group,
   input,
   inputWrap,
-  toggle,
   withPrefix,
   withSuffix,
 } from "./styles.css";
@@ -140,68 +139,6 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>(
 );
 Input.displayName = "Input";
 
-/* ───────── PasswordInput ───────── */
-
-function EyeIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path
-        d="M2 10s3-5.5 8-5.5S18 10 18 10s-3 5.5-8 5.5S2 10 2 10Z"
-        stroke="currentColor"
-        strokeWidth="1.5"
-      />
-      <circle cx="10" cy="10" r="2.25" stroke="currentColor" strokeWidth="1.5" />
-    </svg>
-  );
-}
-
-function EyeOffIcon() {
-  return (
-    <svg viewBox="0 0 20 20" width="16" height="16" fill="none" aria-hidden>
-      <path
-        d="M3 3l14 14M8 5a8 8 0 0 1 2-.3c5 0 8 5.3 8 5.3a13 13 0 0 1-2.3 2.9M12 12a2.5 2.5 0 0 1-3.4-3.4m-2.3-2.5A13 13 0 0 0 2 10s3 5.5 8 5.5a8 8 0 0 0 3.3-.7"
-        stroke="currentColor"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-      />
-    </svg>
-  );
-}
-
-export interface PasswordInputProps extends Omit<InputProps, "type" | "suffix"> {
-  /** 비밀번호 표시 토글 버튼을 숨긴다. @default false */
-  hideToggle?: boolean;
-}
-
-export const PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(
-  ({ hideToggle, ...props }, ref) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const toggleBtn = hideToggle ? undefined : (
-      <button
-        type="button"
-        className={toggle}
-        onClick={() => setVisible((v) => !v)}
-        aria-label={visible ? "비밀번호 숨기기" : "비밀번호 표시"}
-        aria-pressed={visible}
-        tabIndex={-1}
-      >
-        {visible ? <EyeOffIcon /> : <EyeIcon />}
-      </button>
-    );
-
-    return (
-      <Input
-        ref={ref}
-        type={visible ? "text" : "password"}
-        suffix={toggleBtn}
-        {...props}
-      />
-    );
-  },
-);
-PasswordInput.displayName = "PasswordInput";
-
 /* ───────── NumberInput ───────── */
 
 export interface NumberInputProps

package/data/summaries/react.json

@@ -3,7 +3,7 @@
   "summaries": {
     "button": "기본 버튼 — variant(primary/secondary/ghost/danger/link) + size(sm/md/lg).",
     "card": "카드 컨테이너 — compound (Card.Header / Card.Body / Card.Footer / Card.Title / Card.Description).",
-    "input": "단일 행 텍스트 입력 — hasError 지원. 같은 모듈에 NumberInput / PasswordInput / PhoneInput / BusinessNumberInput 변형 포함.",
+    "input": "단일 행 텍스트 입력 — hasError 지원. 같은 모듈에 NumberInput / PhoneInput / BusinessNumberInput 변형 포함. 비밀번호 토글은 InputGroup + InputAdornment 레시피로 조립.",
     "numeric-input": "슬라이더 동반·토큰 편집기용 컴팩트 숫자 입력 — onChange 즉시 min/max clamp, focus select-all, 단위(px/ms/%/° 등) suffix. 일반 폼 입력은 NumberInput 권장.",
     "textarea": "여러 행 텍스트 입력 — rows, autoResize.",
     "label": "폼 레이블 — htmlFor로 입력과 연결.",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sh-ui-cli",
-  "version": "0.59.8",
+  "version": "0.61.0",
   "description": "sh-ui CLI — 프로젝트 스캐폴드(create) + 컴포넌트 추가(add/list/remove) + IDE-내 AI용 MCP 서버",
   "license": "MIT",
   "repository": {
@@ -27,10 +27,10 @@
   "dependencies": {
     "@inquirer/prompts": "^7.0.0",
     "@modelcontextprotocol/sdk": "^1.0.0",
-    "fs-extra": "^11.2.0",
     "zod": "^4.3.6"
   },
   "devDependencies": {
+    "fs-extra": "^11.2.0",
     "vitest": "^3.2.4"
   },
   "publishConfig": {

package/src/create/architectures/flat.js

@@ -43,9 +43,9 @@ export const flatArch = {
   },
 
   // Scoped alias — 카테고리별로 명시. FSD 의 catch-all `@/*` 와 의도적으로 다름.
+  // Next.js 의 `app/` 라우트 디렉토리는 import alias 가 거의 쓰이지 않아 제외.
   tsconfigPaths: {
     '@/lib/*':        ['./lib/*'],
     '@/components/*': ['./components/*'],
-    '@/app/*':        ['./app/*'],
   },
 };