create-modsemi 0.1.0

package/template/src/store/layoutStore.ts

@@ -0,0 +1,82 @@
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+
+export type LayoutMode = 'side' | 'top' | 'mix' | 'double';
+export type ThemeMode = 'light' | 'dark';
+export type ColorTheme = 'blue' | 'violet' | 'teal' | 'rose';
+
+export interface LayoutState {
+  /** 佈局模式 */
+  layoutMode: LayoutMode;
+  /** 主題模式（亮色 / 暗色） */
+  themeMode: ThemeMode;
+  /** 色系主題 */
+  colorTheme: ColorTheme;
+  /** 是否固定 Header */
+  fixedHeader: boolean;
+  /** 是否顯示麵包屑 */
+  showBreadcrumb: boolean;
+  /** 設定面板是否開啟 */
+  settingDrawerOpen: boolean;
+  /** double 模式下第一欄選中的 itemKey */
+  doubleFirstKey: string;
+}
+
+export interface LayoutActions {
+  setLayoutMode: (mode: LayoutMode) => void;
+  setThemeMode: (theme: ThemeMode) => void;
+  toggleTheme: () => void;
+  setColorTheme: (color: ColorTheme) => void;
+  setFixedHeader: (fixed: boolean) => void;
+  setShowBreadcrumb: (show: boolean) => void;
+  setSettingDrawerOpen: (open: boolean) => void;
+  setDoubleFirstKey: (key: string) => void;
+}
+
+const initialState: LayoutState = {
+  layoutMode: 'double',
+  themeMode: 'light',
+  colorTheme: 'blue',
+  fixedHeader: true,
+  showBreadcrumb: true,
+  settingDrawerOpen: false,
+  doubleFirstKey: '/dashboard',
+};
+
+export const useLayoutStore = create<LayoutState & LayoutActions>()(
+  persist(
+    set => ({
+      ...initialState,
+
+      setLayoutMode: mode => set({ layoutMode: mode }),
+
+      setThemeMode: theme => set({ themeMode: theme }),
+
+      toggleTheme: () =>
+        set(state => ({
+          themeMode: state.themeMode === 'light' ? 'dark' : 'light',
+        })),
+
+      setColorTheme: color => set({ colorTheme: color }),
+
+      setFixedHeader: fixed => set({ fixedHeader: fixed }),
+
+      setShowBreadcrumb: show => set({ showBreadcrumb: show }),
+
+      setSettingDrawerOpen: open => set({ settingDrawerOpen: open }),
+
+      setDoubleFirstKey: key => set({ doubleFirstKey: key }),
+    }),
+    {
+      name: 'modsemi-layout',
+      partialize: (state: LayoutState & LayoutActions) => ({
+        layoutMode: state.layoutMode,
+        themeMode: state.themeMode,
+        colorTheme: state.colorTheme,
+        fixedHeader: state.fixedHeader,
+        showBreadcrumb: state.showBreadcrumb,
+        doubleFirstKey: state.doubleFirstKey,
+      }),
+    },
+  ),
+);

package/template/src/store/pageTitleStore.ts

@@ -0,0 +1,12 @@
+import { create } from 'zustand';
+
+interface PageTitleState {
+  /** 頁面元件主動設定的自訂標題，null 代表使用 breadcrumb 自動推導 */
+  customTitle: string | null;
+  setCustomTitle: (title: string | null) => void;
+}
+
+export const usePageTitleStore = create<PageTitleState>(set => ({
+  customTitle: null,
+  setCustomTitle: title => set({ customTitle: title }),
+}));

package/template/src/styles/global.less

@@ -0,0 +1,80 @@
+// ============================================================
+// ModSemi Global Styles
+// 所有全域樣式在此定義；使用 Semi Design CSS 變數確保主題一致性
+// ============================================================
+
+// Reset
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+html,
+body,
+#root {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  min-height: 100vh;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+    'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
+  font-size: 14px;
+  line-height: 1.5715;
+  color: var(--semi-color-text-0);
+  background-color: var(--semi-color-bg-0);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+// 捲軸樣式
+::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 3px;
+  background-color: var(--semi-color-fill-2);
+
+  &:hover {
+    background-color: var(--semi-color-fill-3);
+  }
+}
+
+// 通用工具類別
+.text-ellipsis {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.flex-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.full-height {
+  height: 100%;
+}
+
+// 頁面內容過渡動畫
+.page-enter {
+  opacity: 0;
+  transform: translateY(8px);
+}
+
+.page-enter-active {
+  opacity: 1;
+  transform: translateY(0);
+  transition: opacity 0.25s ease, transform 0.25s ease;
+}

package/template/swagger/sample.json

@@ -0,0 +1,263 @@
+{
+  "openapi": "3.0.3",
+  "info": {
+    "title": "ModSemi Sample API",
+    "description": "示範用 Swagger / OpenAPI 規格，用於測試 orval 程式碼生成。",
+    "version": "1.0.0"
+  },
+  "servers": [
+    {
+      "url": "/api",
+      "description": "本地開發伺服器"
+    }
+  ],
+  "tags": [
+    { "name": "User", "description": "使用者管理" },
+    { "name": "Article", "description": "文章管理" }
+  ],
+  "paths": {
+    "/users": {
+      "get": {
+        "tags": ["User"],
+        "summary": "取得使用者列表",
+        "operationId": "getUsers",
+        "parameters": [
+          {
+            "name": "page",
+            "in": "query",
+            "schema": { "type": "integer", "default": 1 }
+          },
+          {
+            "name": "pageSize",
+            "in": "query",
+            "schema": { "type": "integer", "default": 20 }
+          },
+          {
+            "name": "keyword",
+            "in": "query",
+            "schema": { "type": "string" }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "成功",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/UserListResponse" }
+              }
+            }
+          }
+        }
+      },
+      "post": {
+        "tags": ["User"],
+        "summary": "建立使用者",
+        "operationId": "createUser",
+        "requestBody": {
+          "required": true,
+          "content": {
+            "application/json": {
+              "schema": { "$ref": "#/components/schemas/CreateUserRequest" }
+            }
+          }
+        },
+        "responses": {
+          "201": {
+            "description": "建立成功",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/User" }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/users/{id}": {
+      "get": {
+        "tags": ["User"],
+        "summary": "取得單一使用者",
+        "operationId": "getUserById",
+        "parameters": [
+          {
+            "name": "id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "integer" }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "成功",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/User" }
+              }
+            }
+          },
+          "404": {
+            "description": "使用者不存在"
+          }
+        }
+      },
+      "put": {
+        "tags": ["User"],
+        "summary": "更新使用者",
+        "operationId": "updateUser",
+        "parameters": [
+          {
+            "name": "id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "integer" }
+          }
+        ],
+        "requestBody": {
+          "required": true,
+          "content": {
+            "application/json": {
+              "schema": { "$ref": "#/components/schemas/UpdateUserRequest" }
+            }
+          }
+        },
+        "responses": {
+          "200": {
+            "description": "更新成功",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/User" }
+              }
+            }
+          }
+        }
+      },
+      "delete": {
+        "tags": ["User"],
+        "summary": "刪除使用者",
+        "operationId": "deleteUser",
+        "parameters": [
+          {
+            "name": "id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "integer" }
+          }
+        ],
+        "responses": {
+          "204": { "description": "刪除成功" }
+        }
+      }
+    },
+    "/articles": {
+      "get": {
+        "tags": ["Article"],
+        "summary": "取得文章列表",
+        "operationId": "getArticles",
+        "parameters": [
+          {
+            "name": "page",
+            "in": "query",
+            "schema": { "type": "integer", "default": 1 }
+          },
+          {
+            "name": "status",
+            "in": "query",
+            "schema": {
+              "type": "string",
+              "enum": ["draft", "published", "archived"]
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "成功",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/ArticleListResponse" }
+              }
+            }
+          }
+        }
+      }
+    }
+  },
+  "components": {
+    "schemas": {
+      "User": {
+        "type": "object",
+        "properties": {
+          "id": { "type": "integer", "example": 1 },
+          "name": { "type": "string", "example": "Admin" },
+          "email": { "type": "string", "format": "email", "example": "admin@modsemi.dev" },
+          "roles": {
+            "type": "array",
+            "items": { "type": "string" },
+            "example": ["admin"]
+          },
+          "createdAt": { "type": "string", "format": "date-time" }
+        }
+      },
+      "CreateUserRequest": {
+        "type": "object",
+        "required": ["name", "email"],
+        "properties": {
+          "name": { "type": "string" },
+          "email": { "type": "string", "format": "email" },
+          "roles": {
+            "type": "array",
+            "items": { "type": "string" }
+          }
+        }
+      },
+      "UpdateUserRequest": {
+        "type": "object",
+        "properties": {
+          "name": { "type": "string" },
+          "email": { "type": "string", "format": "email" },
+          "roles": {
+            "type": "array",
+            "items": { "type": "string" }
+          }
+        }
+      },
+      "UserListResponse": {
+        "type": "object",
+        "properties": {
+          "data": {
+            "type": "array",
+            "items": { "$ref": "#/components/schemas/User" }
+          },
+          "total": { "type": "integer" },
+          "page": { "type": "integer" },
+          "pageSize": { "type": "integer" }
+        }
+      },
+      "Article": {
+        "type": "object",
+        "properties": {
+          "id": { "type": "integer" },
+          "title": { "type": "string" },
+          "content": { "type": "string" },
+          "status": {
+            "type": "string",
+            "enum": ["draft", "published", "archived"]
+          },
+          "author": { "$ref": "#/components/schemas/User" },
+          "createdAt": { "type": "string", "format": "date-time" }
+        }
+      },
+      "ArticleListResponse": {
+        "type": "object",
+        "properties": {
+          "data": {
+            "type": "array",
+            "items": { "$ref": "#/components/schemas/Article" }
+          },
+          "total": { "type": "integer" },
+          "page": { "type": "integer" },
+          "pageSize": { "type": "integer" }
+        }
+      }
+    }
+  }
+}

package/template/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "extends": "@modern-js/tsconfig/base",
+  "compilerOptions": {
+    "moduleResolution": "bundler",
+    "ignoreDeprecations": "6.0",
+    "declaration": false,
+    "jsx": "preserve",
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["./src/*"],
+      "@shared/*": ["./shared/*"]
+    }
+  },
+  "include": ["src", "shared", "config", "modern.config.ts"],
+  "exclude": ["**/node_modules"]
+}