{"id":47605304,"url":"https://github.com/zuohuadong/svadmin","last_synced_at":"2026-06-04T00:03:30.506Z","repository":{"id":346050707,"uuid":"1188391627","full_name":"zuohuadong/svadmin","owner":"zuohuadong","description":"Headless admin framework for Svelte 5 — bring your own backend | 面向 Svelte 5 的 Headless 管理后台框架","archived":false,"fork":false,"pushed_at":"2026-05-23T14:37:44.000Z","size":2552,"stargazers_count":4,"open_issues_count":0,"forks_count":2,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-30T19:04:39.070Z","etag":null,"topics":["admin","admin-panel","appwrite","crud","data-provider","elysia","headless","pocketbase","shadcn-svelte","supabase","svelte","svelte5","tanstack-query","typescript"],"latest_commit_sha":null,"homepage":"https://svadmin.nestjs.cn","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zuohuadong.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":"AGENTS.md","dco":null,"cla":null}},"created_at":"2026-03-22T02:22:26.000Z","updated_at":"2026-05-27T16:59:04.000Z","dependencies_parsed_at":null,"dependency_job_id":"d596414c-d5a1-4783-83de-e47febacd699","html_url":"https://github.com/zuohuadong/svadmin","commit_stats":null,"previous_names":["zuohuadong/svadmin"],"tags_count":378,"template":false,"template_full_name":null,"purl":"pkg:github/zuohuadong/svadmin","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zuohuadong%2Fsvadmin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zuohuadong%2Fsvadmin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zuohuadong%2Fsvadmin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zuohuadong%2Fsvadmin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zuohuadong","download_url":"https://codeload.github.com/zuohuadong/svadmin/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zuohuadong%2Fsvadmin/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33884749,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-03T02:00:06.370Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["admin","admin-panel","appwrite","crud","data-provider","elysia","headless","pocketbase","shadcn-svelte","supabase","svelte","svelte5","tanstack-query","typescript"],"created_at":"2026-04-01T19:10:58.347Z","updated_at":"2026-06-04T00:03:30.500Z","avatar_url":"https://github.com/zuohuadong.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# svadmin\n\n\u003e Headless admin framework for Svelte 5 — bring your own backend\n\u003e\n\u003e 面向 Svelte 5 的 Headless 管理后台框架 — 自带后端适配\n\n[![npm](https://img.shields.io/npm/v/@svadmin/core?color=ff3e00\u0026label=npm)](https://www.npmjs.com/package/@svadmin/core)\n[![license](https://img.shields.io/github/license/zuohuadong/svadmin)](LICENSE)\n\n[English](#-features) | [中文](#-特性) | [📖 Documentation / 文档](https://svadmin.nestjs.cn)\n\n---\n\n## ✨ Features\n\n- 🎯 **Headless Architecture** — DataProvider / AuthProvider / RouterProvider / LiveProvider, swap backends freely\n- ⚡ **30+ Reactive Hooks** — `useList`, `useOne`, `useCreate`, `useUpdate`, `useDelete`, `useTable`, `useForm`, `useSelect`, `useInfiniteList`, `useShow`, `useStepsForm`, `useModalForm`, `useDrawerForm`, etc.\n- 🔑 **Auth Hooks** — `useLogin`, `useLogout`, `useRegister`, `useForgotPassword`, `useUpdatePassword`, `useGetIdentity`, `useIsAuthenticated`, `useOnError`, `usePermissions`\n- 🧩 **Pre-built UI** — AdminApp, AutoTable, AutoForm, ShowPage, Sidebar, Layout, StepsForm, CommandPalette, Sheet, Drawer, Collapsible, Tooltip (shadcn-svelte)\n- 🔠 **16 Field Components** — TextField, UrlField, EmailField, BooleanField, TagField, FileField, ImageField, MarkdownField, RichTextField, SelectField, MultiSelectField, RelationField, JsonField, ComboboxField, PasswordInput\n- 🔘 **CRUD Buttons** — CreateButton, EditButton, DeleteButton, ShowButton, ListButton, RefreshButton, ExportButton, ImportButton, SaveButton, CloneButton\n- 🛡️ **`\u003cAuthenticated\u003e`** — Conditionally render based on auth state with loading/fallback\n- ⚙️ **ConfigErrorScreen** — Glassmorphism screen for missing env vars with copy-to-clipboard\n- 🌍 **i18n** — Built-in zh-CN/en with browser auto-detection, one-click locale toggle\n- 🔐 **Auth \u0026 RBAC** — AuthProvider + permission system with resource-level access control\n- 🌓 **Dark Mode** — Light / Dark / System with one-click toggle, persisted to localStorage\n- 🎨 **Multi-Color Themes** — 6 color palettes (Blue, Green, Rose, Orange, Violet, Zinc) with sidebar picker\n- 🪟 **Glassmorphism UI** — Translucent sidebar with backdrop blur for a premium look\n- 📡 **Real-time** — LiveProvider interface with WebSocket \u0026 SSE built-in providers\n- 🔀 **RouterProvider** — Pluggable routing with hash and history router providers\n- 📋 **Audit Logging** — Pluggable audit handler for tracking admin operations\n- 🔍 **Inferencer** — Auto-generate admin UI from sample data or OpenAPI 3.x specs\n- 🏷️ **Resource Type Registry** — Compile-time resource name checking via `KnownResources` + auto type inference via `InferData\u003cR\u003e`\n- 🧰 **Helpers** — `unionFilters`, `unionSorters`, `file2Base64`, `getDefaultFilter`, `getDefaultSortOrder`, `generateDefaultDocumentTitle`\n- 📤 **Data Transfer** — `useExport` / `useImport` for CSV export/import with batch support\n- 🔄 **Optimistic Updates** — Built-in pessimistic / optimistic / undoable mutation modes\n\n## ✨ 特性\n\n- 🎯 **Headless 架构** — DataProvider / AuthProvider / RouterProvider / LiveProvider，自由切换后端\n- ⚡ **30+ 响应式 Hook** — `useList`、`useOne`、`useCreate`、`useUpdate`、`useDelete`、`useTable`、`useForm`、`useSelect`、`useInfiniteList`、`useShow`、`useStepsForm`、`useModalForm`、`useDrawerForm` 等\n- 🔑 **Auth Hooks** — `useLogin`、`useLogout`、`useRegister`、`useForgotPassword`、`useUpdatePassword`、`useGetIdentity`、`useIsAuthenticated`、`useOnError`、`usePermissions`\n- 🧩 **开箱即用 UI** — AdminApp、AutoTable、AutoForm、ShowPage、Sidebar、Layout、StepsForm、CommandPalette、Sheet、Drawer、Collapsible、Tooltip（基于 shadcn-svelte）\n- 🔠 **16 种字段组件** — TextField、UrlField、EmailField、BooleanField、TagField、FileField、ImageField、MarkdownField、RichTextField、SelectField、MultiSelectField、RelationField、JsonField、ComboboxField、PasswordInput\n- 🔘 **CRUD 按钮** — CreateButton、EditButton、DeleteButton、ShowButton、ListButton、RefreshButton、ExportButton、ImportButton、SaveButton、CloneButton\n- 🛡️ **`\u003cAuthenticated\u003e`** — 根据认证状态条件渲染，支持 loading/fallback\n- ⚙️ **ConfigErrorScreen** — 环境变量缺失提示页，毛玻璃风格，支持一键复制\n- 🌍 **国际化** — 内置中英文，浏览器自动检测，侧边栏一键切换语言\n- 🔐 **认证与权限** — AuthProvider + 资源级权限控制\n- 🌓 **暗色模式** — 亮色 / 暗色 / 跟随系统，一键切换，持久化到 localStorage\n- 🎨 **多色主题** — 6 种配色方案（Blue、Green、Rose、Orange、Violet、Zinc），侧边栏选色器切换\n- 🪟 **毛玻璃 UI** — 半透明侧边栏 + 背景模糊，质感拉满\n- 📡 **实时订阅** — LiveProvider 接口，内置 WebSocket 及 SSE 实现，自动重连\n- 🔀 **RouterProvider** — 可插拔路由，内置 Hash 和 History 路由\n- 📋 **审计日志** — 可插拔的审计处理器\n- 🔍 **推断器（Inferencer）** — 从样本数据或 OpenAPI 3.x 自动生成管理 UI\n- 🏷️ **资源类型注册表** — 编译时资源名检查（`KnownResources`）+ 自动类型推断（`InferData\u003cR\u003e`）\n- 🧰 **工具函数** — `unionFilters`、`unionSorters`、`file2Base64`、`getDefaultFilter`、`getDefaultSortOrder`、`generateDefaultDocumentTitle`\n- 📤 **数据导入导出** — `useExport` / `useImport`，支持 CSV 批量导入导出\n- 🔄 **乐观更新** — 内置悲观 / 乐观 / 可撤销三种变更模式\n\n## 📦 Packages / 包\n\n### Core / 核心\n\n| Package                  | Description / 描述                                           |\n| ------------------------ | ------------------------------------------------------------ |\n| `@svadmin/core`          | Hooks, providers, types, utilities, Resource Type Registry   |\n| `@svadmin/ui`            | Pre-built admin components / 预构建管理组件（shadcn-svelte） |\n| `@svadmin/create`        | CLI scaffolding tool / CLI 脚手架工具                        |\n| `@svadmin/refine-adapter`| Bridge any @refinedev/* data provider to svadmin / 桥接 Refine 生态数据源 |\n| `@svadmin/sveltekit`     | SvelteKit router integration / SvelteKit 路由集成            |\n| `@svadmin/lite`          | SSR-only variant (no client JS) / 纯 SSR 变体               |\n| `@svadmin/sso`           | OIDC/OAuth2 SSO plugin / 单点登录插件                        |\n| `@svadmin/editor`        | Rich-text editor component / 富文本编辑器组件                |\n| `@svadmin/mcp`           | MCP (Model Context Protocol) integration / AI 工具集成       |\n\n### Data Providers / 数据适配器\n\n| Package                 | Backend                                      |\n| ----------------------- | -------------------------------------------- |\n| `@svadmin/simple-rest`  | REST API (zero deps, JWT/Cookie auth)        |\n| `@svadmin/supabase`     | Supabase (data + auth + live)                |\n| `@svadmin/drizzle`      | Drizzle ORM (SQLite, PostgreSQL, MySQL, D1)  |\n| `@svadmin/pocketbase`   | PocketBase (data + auth + live)              |\n| `@svadmin/appwrite`     | Appwrite (data + auth + live)                |\n| `@svadmin/graphql`      | GraphQL                                      |\n| `@svadmin/elysia`       | Elysia (auto type inference via Eden Treaty) |\n| `@svadmin/strapi`       | Strapi CMS                                   |\n| `@svadmin/directus`     | Directus                                     |\n| `@svadmin/firebase`     | Firebase / Firestore                         |\n| `@svadmin/hasura`       | Hasura GraphQL                               |\n| `@svadmin/sanity`       | Sanity.io                                    |\n| `@svadmin/airtable`     | Airtable                                     |\n| `@svadmin/medusa`       | Medusa Commerce                              |\n| `@svadmin/nestjs-query` | NestJS GraphQL                               |\n| `@svadmin/nestjsx-crud` | NestJS CRUD                                  |\n\n## 🚀 Quick Start / 快速开始\n\n```bash\n# Install\nbun add @svadmin/core @svadmin/ui @svadmin/simple-rest\n```\n\n### One-Line Setup / 一行配置\n\n```svelte\n\u003cscript lang=\"ts\"\u003e\n  import { AdminApp } from '@svadmin/ui';\n  import { createSimpleRestDataProvider } from '@svadmin/simple-rest';\n  import { resources } from './resources';\n\n  const dataProvider = createSimpleRestDataProvider({\n    apiUrl: 'https://jsonplaceholder.typicode.com',\n  });\n\u003c/script\u003e\n\n\u003cAdminApp {dataProvider} {resources} title=\"My Admin\" defaultTheme=\"system\" /\u003e\n```\n\n### Define Resources / 定义资源\n\n```typescript\nimport type { ResourceDefinition } from \"@svadmin/core\";\n\nexport const resources: ResourceDefinition[] = [\n  {\n    name: \"products\",\n    label: \"Products\",\n    fields: [\n      { key: \"id\", label: \"ID\", type: \"number\", showInForm: false },\n      {\n        key: \"name\",\n        label: \"Name\",\n        type: \"text\",\n        required: true,\n        searchable: true,\n      },\n      { key: \"price\", label: \"Price\", type: \"number\", required: true },\n      {\n        key: \"status\",\n        label: \"Status\",\n        type: \"select\",\n        options: [\n          { label: \"Active\", value: \"active\" },\n          { label: \"Draft\", value: \"draft\" },\n        ],\n      },\n    ],\n  },\n];\n```\n\n### With Supabase / 使用 Supabase\n\n```svelte\n\u003cscript lang=\"ts\"\u003e\n  import { AdminApp } from '@svadmin/ui';\n  import {\n    createSupabaseDataProvider,\n    createSupabaseAuthProvider,\n    createSupabaseLiveProvider,\n  } from '@svadmin/supabase';\n  import { createClient } from '@supabase/supabase-js';\n  import { resources } from './resources';\n  import Login from './pages/Login.svelte';\n\n  const supabase = createClient(\n    import.meta.env.VITE_SUPABASE_URL,\n    import.meta.env.VITE_SUPABASE_ANON_KEY\n  );\n\u003c/script\u003e\n\n\u003cAdminApp\n  dataProvider={createSupabaseDataProvider(supabase)}\n  authProvider={createSupabaseAuthProvider(supabase)}\n  liveProvider={createSupabaseLiveProvider(supabase)}\n  {resources}\n  title=\"My App\"\n\u003e\n  {#snippet loginPage()}\u003cLogin /\u003e{/snippet}\n\u003c/AdminApp\u003e\n```\n\n### With SupaCloud Tasks / 使用 SupaCloud 任务增强\n\n`@supacloud/js` does not replace `@supabase/supabase-js`. It wraps a normal Supabase client and adds task-oriented platform APIs. `@svadmin/supabase` keeps the official Supabase adapters unchanged and exposes the optional `@svadmin/supabase/supacloud` subpath for these task features.\n\n`@supacloud/js` 不是 `@supabase/supabase-js` 的替代品，而是建立在官方 Supabase 客户端之上的平台增强层。`@svadmin/supabase` 会继续保持官方 Supabase 适配器不变，并通过可选子路径 `@svadmin/supabase/supacloud` 提供任务能力接入。\n\n```bash\nbun add @svadmin/supabase @supabase/supabase-js @supacloud/js\n```\n\n```ts\nimport { createClient } from '@supabase/supabase-js';\nimport { createSupaCloudClient } from '@supacloud/js';\nimport {\n  createSupaCloudTaskProvider,\n  createSupaCloudTaskLiveProvider,\n} from '@svadmin/supabase/supacloud';\n\nconst supabase = createClient(\n  import.meta.env.VITE_SUPABASE_URL,\n  import.meta.env.VITE_SUPABASE_ANON_KEY,\n);\n\nconst supacloud = createSupaCloudClient({\n  supabase,\n  managementApiUrl: import.meta.env.VITE_SUPACLOUD_API_URL,\n  projectRef: import.meta.env.VITE_SUPACLOUD_PROJECT_REF,\n});\n\nconst taskProvider = createSupaCloudTaskProvider({ supacloud });\nconst taskLiveProvider = createSupaCloudTaskLiveProvider({ supacloud });\n```\n\n```ts\nconst task = await taskProvider.submit('aorist-ai/generate/crop', {\n  body: { image_id: 'img_123' },\n  idempotencyKey: 'crop-img_123-v1',\n});\n\nconst finalState = await task.wait();\nconsole.log(finalState.status);\n```\n\n```ts\nconst stop = taskLiveProvider.subscribe({\n  resource: 'tasks',\n  liveParams: { taskId: 'task_123' },\n  callback: (event) =\u003e {\n    console.log(event.payload);\n  },\n});\n\nstop();\n```\n\n### With Elysia (Type-Safe) / 使用 Elysia（端到端类型安全）\n\n```typescript\n// Server: export your Elysia app type\nimport { Elysia } from \"elysia\";\nconst app = new Elysia().get(\"/posts\", () =\u003e db.posts.findMany());\nexport type App = typeof app;\n\n// Client: auto-infer resource types\nimport { createElysiaDataProvider } from \"@svadmin/elysia\";\nimport type { InferResourceMap } from \"@svadmin/elysia\";\nimport type { App } from \"./server\";\n\n// ResourceTypeMap auto-derived from Elysia routes\ndeclare module \"@svadmin/core\" {\n  interface ResourceTypeMap extends InferResourceMap\u003cApp\u003e {}\n}\n\nconst dataProvider = createElysiaDataProvider\u003cApp\u003e(\"http://localhost:3000\");\n```\n\n### Tailwind CSS v4 Integration / Tailwind CSS v4 集成\n\n\u003e **Important / 重要**: Tailwind CSS v4 does not scan `node_modules` by default. You **must** add `@source` directives so that utility classes used by `@svadmin/ui` components are generated.\n\u003e\n\u003e Tailwind CSS v4 默认不扫描 `node_modules`。你**必须**添加 `@source` 指令，否则 `@svadmin/ui` 组件使用的工具类不会被生成，导致布局完全错乱。\n\n**1. Add `@source` to your CSS entry file / 在 CSS 入口文件中添加 `@source`:**\n\n```css\n/* app.css */\n@import \"tailwindcss\";\n\n/* Required: tell Tailwind v4 to scan svadmin component sources */\n@source \"../node_modules/@svadmin/ui/src\";\n@source \"../node_modules/@svadmin/core/src\";\n```\n\n**2. Configure Vite `optimizeDeps` / 配置 Vite `optimizeDeps`:**\n\nSince `@svadmin/ui` ships raw `.svelte` source files (not pre-built), exclude the svadmin packages from pre-bundling and explicitly include their CJS peer dependencies. If you use `@svadmin/supabase` in a Vite app, make sure it is also listed in `optimizeDeps.exclude`, otherwise Vite may pre-bundle it and throw dev-time optional-peer/export errors such as `createRefineAdapter` not being found:\n\n由于 `@svadmin/ui` 提供的是原始 `.svelte` 源码文件（非预构建），需要将 svadmin 包排除在预打包之外，并显式包含其 CJS 对等依赖。如果你的 Vite 项目使用了 `@svadmin/supabase`，也必须把它加入 `optimizeDeps.exclude`；否则 Vite 可能错误预打包它，并在开发环境里抛出 `createRefineAdapter` 找不到之类的 optional-peer/export 异常：\n\n```typescript\n// vite.config.ts\nexport default defineConfig({\n  optimizeDeps: {\n    exclude: [\"@svadmin/core\", \"@svadmin/ui\", \"@svadmin/supabase\"],\n    include: [\n      \"@svadmin/core \u003e @tanstack/svelte-query\",\n      \"@svadmin/ui \u003e svelte-sonner\",\n      \"@svadmin/ui \u003e vaul-svelte\",\n      \"@svadmin/ui \u003e cmdk-sv\",\n      \"@svadmin/ui \u003e bits-ui\",\n      \"@svadmin/ui \u003e @tanstack/svelte-table\",\n      \"@svadmin/ui \u003e @lucide/svelte\",\n      \"highlight.js\",\n      \"marked\",\n      \"marked-highlight\",\n      \"isomorphic-dompurify\",\n    ],\n  },\n});\n```\n\n## 🏗️ `\u003cAdminApp\u003e` Props\n\n| Prop             | Type                            | Required | Default    | Description                                   |\n| ---------------- | ------------------------------- | -------- | ---------- | --------------------------------------------- |\n| `dataProvider`   | `DataProvider`                  | ✅       | —          | Data source adapter / 数据源适配器            |\n| `authProvider`   | `AuthProvider`                  | —        | —          | Auth adapter / 认证适配器                     |\n| `routerProvider` | `RouterProvider`                | —        | hash       | Custom router / 自定义路由提供者              |\n| `resources`      | `ResourceDefinition[]`          | ✅       | —          | Resource definitions / 资源定义               |\n| `title`          | `string`                        | —        | `'Admin'`  | App title / 应用标题                          |\n| `defaultTheme`   | `'light' \\| 'dark' \\| 'system'` | —        | `'system'` | Initial theme / 初始主题                      |\n| `themeConfig`    | `ThemeConfig`                   | —        | —          | Theme config (strategy, overrides) / 主题配置 |\n| `locale`         | `string`                        | —        | auto       | Override locale / 覆盖语言                    |\n| `dashboard`      | `Snippet`                       | —        | —          | Custom dashboard / 自定义仪表盘               |\n| `loginPage`      | `Snippet`                       | —        | —          | Custom login page / 自定义登录页              |\n| `components`     | `Partial\u003cComponentRegistry\u003e`    | —        | —          | Override default UI components / 覆盖默认组件 |\n\n## 🌓 Dark Mode / 暗色模式\n\nDark mode works out of the box. Use `defaultTheme` prop or the Sidebar toggle:\n\n暗色模式开箱即用。使用 `defaultTheme` prop 或侧边栏切换按钮：\n\n```svelte\n\u003c!-- Follow system / 跟随系统 --\u003e\n\u003cAdminApp {dataProvider} {resources} defaultTheme=\"system\" /\u003e\n\n\u003c!-- Always dark / 始终暗色 --\u003e\n\u003cAdminApp {dataProvider} {resources} defaultTheme=\"dark\" /\u003e\n\n\u003c!-- Dark-first strategy for dark-themed apps / 默认暗色的应用 --\u003e\n\u003cAdminApp {dataProvider} {resources} themeConfig={{ strategy: 'dark-first' }} /\u003e\n```\n\nProgrammatic control / 编程式控制:\n\n```typescript\nimport {\n  setTheme,\n  toggleTheme,\n  getTheme,\n  getResolvedTheme,\n} from \"@svadmin/core\";\n\nsetTheme(\"dark\"); // 'light' | 'dark' | 'system'\ntoggleTheme(); // toggle between light/dark\ngetTheme(); // current setting\ngetResolvedTheme(); // resolved to 'light' or 'dark'\n```\n\n## 🎨 Color Themes / 多色主题\n\nSwitch between 6 color palettes via sidebar picker or programmatically:\n\n通过侧边栏选色器或编程式切换 6 种配色：\n\n```typescript\nimport { getColorTheme, setColorTheme, colorThemes } from \"@svadmin/core\";\nimport type { ColorTheme } from \"@svadmin/core\";\n\nsetColorTheme(\"rose\"); // 'blue' | 'green' | 'rose' | 'orange' | 'violet' | 'zinc'\ngetColorTheme(); // current color theme\nconsole.log(colorThemes); // [{ id: 'blue', label: 'Blue', color: '#3b82f6' }, ...]\n```\n\nAvailable themes / 可用主题: `blue` (default), `green`, `rose`, `orange`, `violet`, `zinc`\n\n## 🏷️ Resource Type Registry / 资源类型注册表\n\nFor end-to-end type safety, register your resource types:\n\n注册资源类型以获得端到端类型安全：\n\n```typescript\n// Extend the ResourceTypeMap interface (declaration merging)\ndeclare module \"@svadmin/core\" {\n  interface ResourceTypeMap {\n    posts: { id: number; title: string; body: string };\n    users: { id: number; name: string; email: string };\n  }\n}\n\n// Now all hooks get compile-time checking:\nuseList({ resource: \"posts\" }); // ✅ OK\nuseList({ resource: \"postz\" }); // ❌ Compile error — typo caught!\n```\n\n## 🔌 Custom DataProvider / 自定义数据源\n\nImplement the `DataProvider` interface to connect any backend:\n\n实现 `DataProvider` 接口即可接入任意后端：\n\n```typescript\nimport type { DataProvider, BaseRecord } from \"@svadmin/core\";\n\nconst myProvider: DataProvider = {\n  getApiUrl: () =\u003e \"https://api.example.com\",\n  getList: async ({ resource, pagination, sorters, filters }) =\u003e {\n    /* ... */\n  },\n  getOne: async ({ resource, id }) =\u003e {\n    /* ... */\n  },\n  create: async ({ resource, variables }) =\u003e {\n    /* ... */\n  },\n  update: async ({ resource, id, variables }) =\u003e {\n    /* ... */\n  },\n  deleteOne: async ({ resource, id }) =\u003e {\n    /* ... */\n  },\n};\n```\n\n## 🏗️ Architecture / 架构\n\n```\n┌──────────────────────────────────────────┐\n│             Your App / 你的应用            │\n│   (resources, pages, providers)           │\n├──────────────────────────────────────────┤\n│           @svadmin/ui                     │\n│  AdminApp · AutoTable · AutoForm          │\n│  ShowPage · 16 Fields · shadcn-svelte     │\n├──────────────────────────────────────────┤\n│           @svadmin/core                   │\n│  30+ Hooks · Context · Router · i18n      │\n│  Permissions · Audit · Theme              │\n│  Resource Type Registry · Helpers         │\n├──────────┬───────────┬───────────────────┤\n│ /supabase│ /drizzle  │ /simple-rest      │\n│ /appwrite│ /graphql  │ /elysia           │\n│ /firebase│ /hasura   │ /pocketbase  ...  │\n├──────────┴───────────┴───────────────────┤\n│       @svadmin/refine-adapter             │\n│  Bridge any @refinedev/* provider         │\n└──────────────────────────────────────────┘\n```\n\n## 📖 Documentation / 文档\n\nFull documentation is available at / 完整文档请访问：\n\n**[svadmin.nestjs.cn](https://svadmin.nestjs.cn)**\n\n## 🤝 Contributing / 贡献\n\nContributions are welcome! 欢迎贡献！\n\n1. Fork the repo\n2. Create your branch (`git checkout -b feat/amazing-feature`)\n3. Commit (`git commit -m 'feat: add amazing feature'`)\n4. Push (`git push origin feat/amazing-feature`)\n5. Open a Pull Request\n\n## 📝 License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzuohuadong%2Fsvadmin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzuohuadong%2Fsvadmin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzuohuadong%2Fsvadmin/lists"}