sh-ui-cli 0.22.2 → 0.23.0

package/templates/monorepo/packages/eslint-config/fsd.js

@@ -0,0 +1,119 @@
+import boundaries from "eslint-plugin-boundaries"
+import importX from "eslint-plugin-import-x"
+import checkFile from "eslint-plugin-check-file"
+import { createTypeScriptImportResolver } from "eslint-import-resolver-typescript"
+
+/**
+ * FSD (Feature-Sliced Design) ESLint configuration.
+ * boundaries: layer import direction + public API enforcement
+ * import-x: import group ordering
+ * check-file: file/folder naming convention enforcement
+ *
+ * @type {import("eslint").Linter.Config[]}
+ */
+export const fsdConfig = [
+  // ── boundaries plugin ──
+  {
+    plugins: {
+      boundaries,
+    },
+    settings: {
+      "import/resolver": {
+        typescript: {
+          alwaysTryTypes: true,
+        },
+      },
+      "boundaries/elements": [
+        { type: "app", pattern: ["src/app"], mode: "folder" },
+        { type: "shared", pattern: ["src/shared/*"], mode: "folder" },
+        { type: "entity", pattern: ["src/entities/*"], mode: "folder" },
+        { type: "feature", pattern: ["src/features/*"], mode: "folder" },
+        { type: "widget", pattern: ["src/widgets/*"], mode: "folder" },
+        { type: "view", pattern: ["src/views/*"], mode: "folder" },
+      ],
+      "boundaries/ignore": ["**/*.test.*", "**/*.spec.*"],
+    },
+    rules: {
+      "boundaries/element-types": [
+        "warn",
+        {
+          default: "disallow",
+          rules: [
+            { from: "app", allow: ["view", "widget", "feature", "entity", "shared"] },
+            { from: "view", allow: ["widget", "feature", "entity", "shared"] },
+            { from: "widget", allow: ["feature", "entity", "shared"] },
+            { from: "feature", allow: ["entity", "shared"] },
+            { from: "entity", allow: ["shared"] },
+            { from: "shared", allow: ["shared"] },
+          ],
+        },
+      ],
+      "boundaries/entry-point": [
+        "warn",
+        {
+          default: "disallow",
+          rules: [
+            { target: "shared", allow: "**" },
+            { target: "app", allow: "**" },
+            {
+              target: ["entity", "widget", "view"],
+              allow: "index.{ts,tsx}",
+            },
+            {
+              target: ["feature"],
+              allow: ["index.{ts,tsx}", "*/index.{ts,tsx}"],
+            },
+          ],
+        },
+      ],
+    },
+  },
+
+  // ── check-file plugin (naming conventions) ──
+  {
+    plugins: {
+      "check-file": checkFile,
+    },
+    rules: {
+      "check-file/filename-naming-convention": [
+        "error",
+        {
+          "**/src/**/*.tsx": "PASCAL_CASE",
+          "**/src/**/*.ts": "CAMEL_CASE",
+        },
+        {
+          ignoreMiddleExtensions: true,
+        },
+      ],
+    },
+  },
+  {
+    files: [
+      "**/index.tsx", "**/index.ts",
+      "**/layout.tsx", "**/page.tsx",
+      "**/error.tsx", "**/not-found.tsx",
+      "**/routing.ts", "**/navigation.ts", "**/request.ts",
+    ],
+    rules: {
+      "check-file/filename-naming-convention": "off",
+    },
+  },
+
+  // ── import-x plugin ──
+  {
+    plugins: {
+      "import-x": importX,
+    },
+    settings: {
+      "import-x/resolver-next": [
+        createTypeScriptImportResolver({
+          alwaysTryTypes: true,
+        }),
+      ],
+    },
+    rules: {
+      "import-x/order": "off",
+      "import-x/no-unresolved": "off",
+    },
+  },
+]

package/templates/monorepo/packages/eslint-config/next.js

@@ -0,0 +1,65 @@
+import js from "@eslint/js"
+import pluginNext from "@next/eslint-plugin-next"
+import checkFile from "eslint-plugin-check-file"
+import eslintConfigPrettier from "eslint-config-prettier"
+import pluginReact from "eslint-plugin-react"
+import pluginReactHooks from "eslint-plugin-react-hooks"
+import globals from "globals"
+import tseslint from "typescript-eslint"
+
+import { config as baseConfig } from "./base.js"
+
+export const nextJsConfig = [
+  ...baseConfig,
+  js.configs.recommended,
+  eslintConfigPrettier,
+  ...tseslint.configs.recommended,
+  {
+    ...pluginReact.configs.flat.recommended,
+    languageOptions: {
+      ...pluginReact.configs.flat.recommended.languageOptions,
+      globals: {
+        ...globals.serviceworker,
+      },
+    },
+  },
+  {
+    plugins: {
+      "@next/next": pluginNext,
+    },
+    rules: {
+      ...pluginNext.configs.recommended.rules,
+      ...pluginNext.configs["core-web-vitals"].rules,
+    },
+  },
+  {
+    plugins: {
+      "react-hooks": pluginReactHooks,
+    },
+    settings: { react: { version: "detect" } },
+    rules: {
+      ...pluginReactHooks.configs.recommended.rules,
+      "react/react-in-jsx-scope": "off",
+      "react/prop-types": "off",
+      "react/function-component-definition": [
+        "warn",
+        {
+          namedComponents: "function-declaration",
+          unnamedComponents: "arrow-function",
+        },
+      ],
+    },
+  },
+  {
+    plugins: {
+      "check-file": checkFile,
+    },
+    rules: {
+      "check-file/filename-naming-convention": [
+        "warn",
+        { "src/**/*.{ts,tsx}": "CAMEL_CASE" },
+        { ignoreMiddleExtensions: true },
+      ],
+    },
+  },
+]

package/templates/monorepo/packages/eslint-config/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@workspace/eslint-config",
+  "version": "0.0.0",
+  "type": "module",
+  "private": true,
+  "exports": {
+    "./base": "./base.js",
+    "./next-js": "./next.js",
+    "./react-internal": "./react-internal.js",
+    "./fsd": "./fsd.js"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.2",
+    "@next/eslint-plugin-next": "^16.1.6",
+    "@typescript-eslint/eslint-plugin": "^8.54.0",
+    "@typescript-eslint/parser": "^8.54.0",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-boundaries": "^5.4.0",
+    "eslint-plugin-check-file": "^3.3.1",
+    "eslint-plugin-import-x": "^4.16.1",
+    "eslint-plugin-only-warn": "^1.1.0",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-turbo": "^2.8.1",
+    "globals": "^17.2.0",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.54.0"
+  }
+}

package/templates/monorepo/packages/eslint-config/react-internal.js

@@ -0,0 +1,36 @@
+import js from "@eslint/js"
+import eslintConfigPrettier from "eslint-config-prettier"
+import pluginReact from "eslint-plugin-react"
+import pluginReactHooks from "eslint-plugin-react-hooks"
+import globals from "globals"
+import tseslint from "typescript-eslint"
+
+import { config as baseConfig } from "./base.js"
+
+export const config = [
+  ...baseConfig,
+  js.configs.recommended,
+  eslintConfigPrettier,
+  ...tseslint.configs.recommended,
+  pluginReact.configs.flat.recommended,
+  {
+    languageOptions: {
+      ...pluginReact.configs.flat.recommended.languageOptions,
+      globals: {
+        ...globals.serviceworker,
+        ...globals.browser,
+      },
+    },
+  },
+  {
+    plugins: {
+      "react-hooks": pluginReactHooks,
+    },
+    settings: { react: { version: "detect" } },
+    rules: {
+      ...pluginReactHooks.configs.recommended.rules,
+      "react/react-in-jsx-scope": "off",
+      "react/prop-types": "off",
+    },
+  },
+]

package/templates/monorepo/packages/typescript-config/base.json

@@ -0,0 +1,20 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "Default",
+  "compilerOptions": {
+    "declaration": true,
+    "declarationMap": true,
+    "esModuleInterop": true,
+    "incremental": false,
+    "isolatedModules": true,
+    "lib": ["es2022", "DOM", "DOM.Iterable"],
+    "module": "NodeNext",
+    "moduleDetection": "force",
+    "moduleResolution": "NodeNext",
+    "noUncheckedIndexedAccess": true,
+    "resolveJsonModule": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "target": "ES2022"
+  }
+}

package/templates/monorepo/packages/typescript-config/nextjs.json

@@ -0,0 +1,13 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "Next.js",
+  "extends": "./base.json",
+  "compilerOptions": {
+    "plugins": [{ "name": "next" }],
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "allowJs": true,
+    "jsx": "preserve",
+    "noEmit": true
+  }
+}

package/templates/monorepo/packages/typescript-config/package.json

@@ -0,0 +1,5 @@
+{
+  "name": "@workspace/typescript-config",
+  "version": "0.0.0",
+  "private": true
+}

package/templates/monorepo/packages/typescript-config/react-library.json

@@ -0,0 +1,8 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "React Library",
+  "extends": "./base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx"
+  }
+}

package/templates/monorepo/packages/ui/ui-core/eslint.config.js

@@ -0,0 +1,3 @@
+import { config } from "@workspace/eslint-config/react-internal"
+
+export default config

package/templates/monorepo/packages/ui/ui-core/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@workspace/ui-core",
+  "version": "0.0.0",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "lint": "eslint . --max-warnings 0"
+  },
+  "dependencies": {
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "tailwind-merge": "^3.5.0"
+  },
+  "devDependencies": {
+    "@workspace/eslint-config": "workspace:*",
+    "@workspace/typescript-config": "workspace:*",
+    "eslint": "^9.39.2",
+    "typescript": "^5.9.3"
+  },
+  "exports": {
+    "./lib/*": "./src/lib/*.ts"
+  }
+}

package/templates/monorepo/packages/ui/ui-core/src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}

package/templates/monorepo/packages/ui/ui-core/tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "extends": "@workspace/typescript-config/react-library.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@workspace/ui-core/*": ["./src/*"]
+    }
+  },
+  "include": ["."],
+  "exclude": ["node_modules", "dist"]
+}

package/templates/monorepo/pnpm-workspace.yaml

@@ -0,0 +1,5 @@
+packages:
+  - "apps/*"
+  - "packages/*"
+  - "packages/ui/ui-core"
+  - "packages/ui/ui-apps/*"

package/templates/monorepo/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "@workspace/typescript-config/base.json"
+}

package/templates/monorepo/turbo.json

@@ -0,0 +1,26 @@
+{
+  "$schema": "https://turbo.build/schema.json",
+  "ui": "tui",
+  "globalEnv": [
+    "NODE_ENV",
+    "API_URL",
+    "CI"
+  ],
+  "tasks": {
+    "build": {
+      "dependsOn": ["^build"],
+      "inputs": ["$TURBO_DEFAULT$", ".env*"],
+      "outputs": [".next/**", "!.next/cache/**"]
+    },
+    "lint": {
+      "dependsOn": ["^lint"]
+    },
+    "typecheck": {
+      "dependsOn": ["^typecheck"]
+    },
+    "dev": {
+      "cache": false,
+      "persistent": true
+    }
+  }
+}

package/templates/nextjs-app/.env.example

@@ -0,0 +1,2 @@
+# API
+API_URL=http://localhost:8080

package/templates/nextjs-app/Dockerfile

@@ -0,0 +1,11 @@
+FROM node:22-alpine
+
+COPY . /app
+
+WORKDIR /app/apps/app-name
+
+EXPOSE 3000
+ENV PORT=3000
+ENV HOSTNAME="0.0.0.0"
+
+CMD ["node", "server.js"]

package/templates/nextjs-app/README.md

@@ -0,0 +1,64 @@
+# Next.js App Template (모노레포용)
+
+모노레포 `apps/` 하위에 배치되는 Next.js 앱 템플릿.
+UI 컴포넌트는 `@workspace/ui-{name}` 패키지를 참조하며, sh-ui 설정을 직접 갖지 않음.
+
+## 기술 스택
+
+- **Next.js 16** (App Router, React Compiler, standalone 출력)
+- **React 19**
+- **TypeScript 5.9**
+- **@workspace/ui-{name}** (sh-ui 컴포넌트 패키지)
+- **TanStack React Query** + **Axios**
+- **Zustand**
+- **next-themes** + **Sonner**
+- **Zod**
+- **Vitest** + **Testing Library**
+- **Docker** 지원
+
+## 프로젝트 구조
+
+```
+├── app/                      # Next.js App Router
+│   ├── layout.tsx            # 루트 레이아웃 (@workspace/ui-{name}/globals.css import)
+│   └── page.tsx
+├── src/
+│   ├── app/
+│   │   └── providers/        # QueryClient, Theme, Toaster
+│   ├── shared/               # FSD: 공유 유틸, 설정, 타입
+│   ├── entities/
+│   ├── features/
+│   ├── views/
+│   └── widgets/
+├── eslint.config.js          # @workspace/eslint-config 사용
+├── tsconfig.json             # @workspace/typescript-config 확장
+├── postcss.config.mjs        # @workspace/ui-{name}/postcss.config 재사용
+├── next.config.ts
+├── vitest.config.ts
+├── Dockerfile
+└── .env.example
+```
+
+## 워크스페이스 의존성
+
+```
+apps/{name}/
+  ├── @workspace/ui-{name}          → packages/ui/ui-apps/ui-{name}  (sh-ui 컴포넌트 + 테마)
+  ├── @workspace/ui-core            → packages/ui/ui-core            (cn 등 유틸)
+  ├── @workspace/eslint-config      → packages/eslint-config
+  └── @workspace/typescript-config  → packages/typescript-config
+```
+
+## sh-ui 컴포넌트 추가
+
+모노레포 루트에서:
+
+```bash
+# 모든 ui 패키지에 추가 (대화형)
+npx sh-ui-create add-component button
+
+# 이 앱의 ui 패키지에만 추가
+npx sh-ui-create add-component button --app {name}
+```
+
+각 `ui-{app}/` 패키지의 `sh-ui.config.json` 경로 설정에 따라 `src/components/` 로 복사됨.

package/templates/nextjs-app/app/layout.tsx

@@ -0,0 +1,22 @@
+import type { Metadata } from 'next';
+import '@workspace/ui-app-name/globals.css';
+import { GlobalProvider } from '@/src/app/providers';
+
+export const metadata: Metadata = {
+  title: 'App Name',
+  description: 'App Description',
+};
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang='ko' suppressHydrationWarning>
+      <body>
+        <GlobalProvider>{children}</GlobalProvider>
+      </body>
+    </html>
+  );
+}

package/templates/nextjs-app/app/page.tsx

@@ -0,0 +1,7 @@
+export default function Home() {
+  return (
+    <main className='flex min-h-screen flex-col items-center justify-center'>
+      <h1 className='text-4xl font-bold'>Hello World</h1>
+    </main>
+  );
+}

package/templates/nextjs-app/eslint.config.js

@@ -0,0 +1,10 @@
+import { nextJsConfig } from "@workspace/eslint-config/next-js"
+import { fsdConfig } from "@workspace/eslint-config/fsd"
+
+export default [
+  {
+    ignores: [".next/**", "dist/**", "node_modules/**"],
+  },
+  ...nextJsConfig,
+  ...fsdConfig,
+]

package/templates/nextjs-app/next.config.ts

@@ -0,0 +1,12 @@
+import type { NextConfig } from 'next';
+
+const nextConfig: NextConfig = {
+  reactCompiler: true,
+  transpilePackages: ['@workspace/ui'],
+  output: 'standalone',
+  images: {
+    unoptimized: process.env.NODE_ENV === 'development',
+  },
+};
+
+export default nextConfig;

package/templates/nextjs-app/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "app-name",
+  "version": "0.0.1",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "dev": "next dev -p 3000 --turbopack",
+    "build": "next build",
+    "start": "next start",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "dependencies": {
+    "@tanstack/react-query": "^5.90.21",
+    "@workspace/ui-app-name": "workspace:*",
+    "axios": "^1.13.6",
+    "lucide-react": "^0.563.0",
+    "next": "16.1.6",
+    "next-themes": "^0.4.6",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "server-only": "^0.0.1",
+    "sonner": "^2.0.7",
+    "zod": "^4.3.6",
+    "zustand": "^5.0.11"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4.1.18",
+    "@tanstack/react-query-devtools": "^5.91.3",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@types/node": "^25.1.0",
+    "@types/react": "^19.2.10",
+    "@types/react-dom": "^19.2.3",
+    "@workspace/eslint-config": "workspace:^",
+    "@workspace/typescript-config": "workspace:*",
+    "babel-plugin-react-compiler": "^1.0.0",
+    "eslint": "^9.39.2",
+    "jsdom": "^29.0.0",
+    "typescript": "^5.9.3",
+    "vitest": "^4.1.0"
+  }
+}

package/templates/nextjs-app/postcss.config.mjs

@@ -0,0 +1 @@
+export { default } from "@workspace/ui-app-name/postcss.config";

package/templates/nextjs-app/src/app/providers/GlobalProvider/index.tsx

@@ -0,0 +1,23 @@
+import type { ReactNode } from 'react';
+import { Toaster } from 'sonner';
+
+import { QueryClientProvider } from '../tanstack/QueryClientProvider';
+import { TanstackDevtoolsProvider } from '../tanstack/TanstackDevtoolsProvider';
+import { ThemeProviders } from '../theme/ThemeProviders';
+
+interface GlobalProviderProps {
+  children: ReactNode;
+}
+
+export function GlobalProvider({ children }: GlobalProviderProps) {
+  return (
+    <ThemeProviders>
+      <QueryClientProvider>
+        <TanstackDevtoolsProvider>
+          <Toaster />
+          {children}
+        </TanstackDevtoolsProvider>
+      </QueryClientProvider>
+    </ThemeProviders>
+  );
+}

package/templates/nextjs-app/src/app/providers/index.tsx

@@ -0,0 +1 @@
+export { GlobalProvider } from './GlobalProvider';

package/templates/nextjs-app/src/app/providers/tanstack/QueryClientProvider.tsx

@@ -0,0 +1,27 @@
+'use client';
+
+import {
+  QueryClient,
+  QueryClientProvider as TanstackQueryClientProvider,
+} from '@tanstack/react-query';
+import { useState, type ReactNode } from 'react';
+
+export function QueryClientProvider({ children }: { children: ReactNode }) {
+  const [queryClient] = useState(
+    () =>
+      new QueryClient({
+        defaultOptions: {
+          queries: {
+            staleTime: 60 * 1000,
+            retry: 1,
+          },
+        },
+      }),
+  );
+
+  return (
+    <TanstackQueryClientProvider client={queryClient}>
+      {children}
+    </TanstackQueryClientProvider>
+  );
+}

package/templates/nextjs-app/src/app/providers/tanstack/TanstackDevtoolsProvider.tsx

@@ -0,0 +1,13 @@
+'use client';
+
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
+import type { ReactNode } from 'react';
+
+export function TanstackDevtoolsProvider({ children }: { children: ReactNode }) {
+  return (
+    <>
+      {children}
+      <ReactQueryDevtools initialIsOpen={false} />
+    </>
+  );
+}

package/templates/nextjs-app/src/app/providers/theme/ThemeProviders.tsx

@@ -0,0 +1,12 @@
+'use client';
+
+import { ThemeProvider } from 'next-themes';
+import type { ReactNode } from 'react';
+
+export function ThemeProviders({ children }: { children: ReactNode }) {
+  return (
+    <ThemeProvider attribute='class' defaultTheme='system' enableSystem>
+      {children}
+    </ThemeProvider>
+  );
+}