@allbluecn/web-app 0.9.1 → 0.9.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@allbluecn/web-app",
-  "version": "0.9.1",
+  "version": "0.9.3",
   "license": "AGPL-3.0-or-later",
   "type": "module",
   "files": [
@@ -14,32 +14,32 @@
       "default": "./vite.shared.ts"
     },
     "./lucide-icon-picker": {
-      "types": "./src/components/shared/lucide-icon-picker/index.tsx",
-      "default": "./src/components/shared/lucide-icon-picker/index.tsx"
+      "types": "./src/components/shared-kit/icons/lucide-icon-picker/index.tsx",
+      "default": "./src/components/shared-kit/icons/lucide-icon-picker/index.tsx"
     },
     "./lucide-icon-picker/panel": {
-      "types": "./src/components/shared/lucide-icon-picker/panel.tsx",
-      "default": "./src/components/shared/lucide-icon-picker/panel.tsx"
+      "types": "./src/components/shared-kit/icons/lucide-icon-picker/panel.tsx",
+      "default": "./src/components/shared-kit/icons/lucide-icon-picker/panel.tsx"
     },
     "./lucide-icon-picker/icon-data": {
-      "types": "./src/components/shared/lucide-icon-picker/icon-data.ts",
-      "default": "./src/components/shared/lucide-icon-picker/icon-data.ts"
+      "types": "./src/components/shared-kit/icons/lucide-icon-picker/icon-data.ts",
+      "default": "./src/components/shared-kit/icons/lucide-icon-picker/icon-data.ts"
     },
     "./lucide-icon-picker/curated-icons": {
-      "types": "./src/components/shared/lucide-icon-picker/curated-icons.ts",
-      "default": "./src/components/shared/lucide-icon-picker/curated-icons.ts"
+      "types": "./src/components/shared-kit/icons/lucide-icon-picker/curated-icons.ts",
+      "default": "./src/components/shared-kit/icons/lucide-icon-picker/curated-icons.ts"
     },
     "./lucide-icon-picker/lucide-icon-by-name": {
-      "types": "./src/components/shared/lucide-icon-picker/lucide-icon-by-name.tsx",
-      "default": "./src/components/shared/lucide-icon-picker/lucide-icon-by-name.tsx"
+      "types": "./src/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name.tsx",
+      "default": "./src/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name.tsx"
     },
     "./prototype": {
       "types": "./src/components/prototype/index.ts",
       "default": "./src/components/prototype/index.ts"
     },
     "./user-avatar": {
-      "types": "./src/components/ui-shared/user-avatar.tsx",
-      "default": "./src/components/ui-shared/user-avatar.tsx"
+      "types": "./src/components/shared-kit/avatars/user-avatar.tsx",
+      "default": "./src/components/shared-kit/avatars/user-avatar.tsx"
     },
     "./lib/datetime": {
       "types": "./src/lib/datetime.ts",
@@ -57,26 +57,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "packageManager": "pnpm@11.20.0",
-  "scripts": {
-    "dev": "vite --port 3000",
-    "build": "vite build",
-    "start": "vite preview",
-    "lint": "eslint",
-    "test": "vitest",
-    "test:ui": "vitest --ui",
-    "test:run": "vitest run",
-    "setup": "pnpm --filter @allbluecn/database generate && pnpm --filter @allbluecn/database migrate:dev",
-    "check:features": "tsx scripts/check-feature-keys.ts",
-    "assemble": "TSX_TSCONFIG_PATH=apps/web/tsconfig.json pnpm -w exec tsx packages/kernel/src/bin.ts --profile oss --assemble --app-dir apps/web",
-    "predev": "pnpm assemble && node scripts/check-sdk-versions.mjs",
-    "prebuild": "pnpm assemble && node scripts/check-sdk-versions.mjs",
-    "pretest": "pnpm assemble",
-    "pretest:run": "pnpm assemble",
-    "prepublishOnly": "node scripts/check-sdk-versions.mjs"
-  },
   "dependencies": {
-    "@allbluecn/database": "workspace:*",
     "@ariakit/react": "^0.4.28",
     "@auth/core": "^0.41.2",
     "@auth/prisma-adapter": "^2.11.2",
@@ -199,10 +180,10 @@
     "zod": "^4.4.3",
     "@open-file-viewer/core": "^0.1.43",
     "@open-file-viewer/react": "^0.1.43",
-    "@allbluecn/kernel": "0.5.1"
+    "@allbluecn/kernel": "0.5.2",
+    "@allbluecn/database": "0.4.17"
   },
   "devDependencies": {
-    "@allblue/devtools": "workspace:*",
     "@babel/parser": "^8.0.4",
     "@babel/traverse": "^8.0.4",
     "@cloudflare/vite-plugin": "^1.40.1",
@@ -242,5 +223,21 @@
   },
   "optionalDependencies": {
     "@tauri-apps/api": "^2.11.1"
+  },
+  "scripts": {
+    "dev": "vite --port 3000",
+    "build": "vite build",
+    "start": "vite preview",
+    "lint": "eslint",
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "test:run": "vitest run",
+    "setup": "pnpm --filter @allbluecn/database generate && pnpm --filter @allbluecn/database migrate:dev",
+    "check:features": "tsx scripts/check-feature-keys.ts",
+    "assemble": "TSX_TSCONFIG_PATH=apps/web/tsconfig.json pnpm -w exec tsx packages/kernel/src/bin.ts --profile oss --assemble --app-dir apps/web",
+    "predev": "pnpm assemble && node scripts/check-sdk-versions.mjs",
+    "prebuild": "pnpm assemble && node scripts/check-sdk-versions.mjs",
+    "pretest": "pnpm assemble",
+    "pretest:run": "pnpm assemble"
   }
-}
+}

package/src/__tests__/components/reference-inline.test.tsx

@@ -17,7 +17,7 @@
 
 import { describe, it, expect } from 'vitest'
 import { render, screen } from '@testing-library/react'
-import { ReferenceInline } from '@/components/ui-shared'
+import { ReferenceInline } from '@/components/shared-kit'
 
 describe('ReferenceInline', () => {
   it('renders title', () => {

package/src/components/agents/agents-page.tsx

@@ -14,7 +14,7 @@ import {
 } from '@/components/ui/tabs'
 import { Button } from '@/components/ui/button'
 import { FeatureGate } from '@/components/billing/feature-gate'
-import { NameConfirmDialog } from '@/components/shared/name-confirm-dialog'
+import { NameConfirmDialog } from '@/components/shared-kit/dialogs/name-confirm-dialog'
 import { listAgentsFn } from '@/server/serverFns/agents/agent-crud'
 import { listSkillsFn, deleteSkillFn } from '@/server/serverFns/agents/skill-crud'
 import { deleteAgentFn } from '@/server/serverFns/agents/agent-crud'

package/src/components/animated-icons/layout-panel-top.tsx

@@ -1 +1 @@
-export * from '@/components/ui-shared/layout-panel-top'
+export * from '@/components/shared-kit/layout/layout-panel-top'

package/src/components/auth/auth-layout.tsx

@@ -1 +1 @@
-export * from '@/components/ui-shared/auth-layout'
+export * from '@/components/shared-kit/auth/auth-layout'

package/src/components/devtools/ai-chat-panel.tsx

@@ -0,0 +1,54 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+export function AIChatPanel() {
+  return (
+    <div className="flex h-full flex-col gap-4 overflow-auto p-3">
+      <div className="space-y-2">
+        <h4 className="text-sm font-semibold">AI Chat 监控</h4>
+        <p className="text-xs text-muted-foreground">
+          预留面板：监控 AI 对话状态、模型选择和 Token 消耗。
+        </p>
+      </div>
+      <div className="space-y-2">
+        <h4 className="text-sm font-semibold">配置</h4>
+        <div className="rounded border p-3 space-y-2">
+          <div className="text-xs">
+            <span className="text-muted-foreground">SSE 端点: </span>
+            <code>/api/chat</code>
+          </div>
+          <div className="text-xs">
+            <span className="text-muted-foreground">Adapter: </span>
+            <span>TanStack AI + OpenRouter/Anthropic/Gemini/…</span>
+          </div>
+          <div className="text-xs">
+            <span className="text-muted-foreground">持久化: </span>
+            <span>Prisma (AiProviderConfig)</span>
+          </div>
+        </div>
+      </div>
+      <div className="space-y-2">
+        <h4 className="text-sm font-semibold">调试提示</h4>
+        <div className="rounded border border-amber-200 bg-amber-50 p-2">
+          <p className="text-xs text-amber-800">
+            使用浏览器 DevTools Network 面板查看 <code>/api/chat</code> SSE 连接。
+          </p>
+        </div>
+      </div>
+    </div>
+  )
+}

package/src/components/devtools/devtools-panel.tsx

@@ -0,0 +1,100 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+import { useEffect, useState, useCallback } from 'react'
+import { AIChatPanel } from './ai-chat-panel'
+import { SessionPanel } from './session-panel'
+
+type TabName = 'ai-chat' | 'session'
+
+interface TabConfig {
+  id: TabName
+  label: string
+}
+
+const TABS: TabConfig[] = [
+  { id: 'ai-chat', label: 'AI Chat' },
+  { id: 'session', label: 'Session' },
+]
+
+export function DevtoolsPanel() {
+  const [isOpen, setIsOpen] = useState(false)
+  const [activeTab, setActiveTab] = useState<TabName>('ai-chat')
+
+  const toggle = useCallback(() => setIsOpen((v) => !v), [])
+
+  useEffect(() => {
+    const handleEsc = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') setIsOpen(false)
+    }
+    const handleModD = (e: KeyboardEvent) => {
+      if ((e.metaKey || e.ctrlKey) && e.shiftKey && e.key === 'D') {
+        e.preventDefault()
+        toggle()
+      }
+    }
+    document.addEventListener('keydown', handleEsc)
+    document.addEventListener('keydown', handleModD)
+    return () => {
+      document.removeEventListener('keydown', handleEsc)
+      document.removeEventListener('keydown', handleModD)
+    }
+  }, [toggle])
+
+  const panel = activeTab === 'ai-chat' ? <AIChatPanel /> : <SessionPanel />
+
+  return (
+    <>
+      <button
+        onClick={toggle}
+        className="fixed left-4 bottom-4 z-[10000] rounded-full bg-blue-600 px-3 py-1.5 text-xs text-white shadow-lg hover:bg-blue-700"
+      >
+        AllBlue Dev
+      </button>
+      {isOpen && (
+        <div className="fixed right-4 top-4 z-[10000] h-96 w-11/12 max-w-md overflow-hidden rounded-lg border bg-background shadow-2xl">
+          <div className="flex items-center justify-between border-b px-3 py-2">
+            <div className="flex gap-1">
+              {TABS.map((tab) => (
+                <button
+                  key={tab.id}
+                  onClick={() => setActiveTab(tab.id)}
+                  className={`rounded px-2 py-1 text-xs font-medium ${
+                    activeTab === tab.id
+                      ? 'bg-primary text-primary-foreground'
+                      : 'text-muted-foreground hover:text-foreground'
+                  }`}
+                >
+                  {tab.label}
+                </button>
+              ))}
+            </div>
+            <button
+              onClick={() => setIsOpen(false)}
+              className="text-muted-foreground hover:text-foreground"
+            >
+              <span className="text-sm">×</span>
+            </button>
+          </div>
+          <div className="h-[calc(100%-44px)] overflow-auto">
+            {panel}
+          </div>
+        </div>
+      )}
+    </>
+  )
+}

package/src/components/{ui-shared/skeleton.tsx → devtools/index.ts}

@@ -15,16 +15,6 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-import { cn } from "./utils"
-
-function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="skeleton"
-      className={cn("animate-pulse rounded-md bg-muted", className)}
-      {...props}
-    />
-  )
-}
-
-export { Skeleton }
+export { AIChatPanel } from './ai-chat-panel'
+export { DevtoolsPanel } from './devtools-panel'
+export { SessionPanel } from './session-panel'

package/src/components/devtools/session-panel.tsx

@@ -0,0 +1,102 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+import { useEffect, useState } from 'react'
+
+type UserInfo = {
+  id: string
+  email: string
+  name: string | null
+  role: string
+  aiProvider?: string | null
+  aiModel?: string | null
+  hasAiKey?: boolean | null
+}
+
+export function SessionPanel() {
+  const [user, setUser] = useState<UserInfo | null>(null)
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    fetch('/api/auth/session', { credentials: 'include' })
+      .then((res) => res.ok ? res.json() : null)
+      .then((data) => {
+        setUser(data?.user ?? null)
+        setLoading(false)
+      })
+      .catch(() => setLoading(false))
+  }, [])
+
+  if (loading) {
+    return (
+      <div className="flex h-full items-center justify-center">
+        <span className="text-sm text-muted-foreground">加载中…</span>
+      </div>
+    )
+  }
+
+  if (!user) {
+    return (
+      <div className="flex h-full items-center justify-center">
+        <span className="text-sm text-muted-foreground">未登录</span>
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex h-full flex-col gap-4 overflow-auto p-3">
+      <div className="space-y-2">
+        <h4 className="text-sm font-semibold">当前用户</h4>
+        <div className="grid grid-cols-2 gap-2 text-xs">
+          <div>
+            <span className="text-muted-foreground">ID: </span>
+            <code>{user.id}</code>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Email: </span>
+            <span>{user.email}</span>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Name: </span>
+            <span>{user.name || '-'}</span>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Role: </span>
+            <span className="font-medium">{user.role}</span>
+          </div>
+        </div>
+      </div>
+      <div className="space-y-2">
+        <h4 className="text-sm font-semibold">AI 配置</h4>
+        <div className="grid grid-cols-2 gap-2 text-xs">
+          <div>
+            <span className="text-muted-foreground">Provider: </span>
+            <span>{user.aiProvider || '未配置'}</span>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Model: </span>
+            <span>{user.aiModel || '未配置'}</span>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Has Key: </span>
+            <span>{user.hasAiKey ? '是' : '否'}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}

package/src/components/knowledge/dialog/knowledge-form-dialog.tsx

@@ -28,7 +28,7 @@ import {
   DialogHeader,
   DialogTitle,
 } from "@/components/ui/dialog";
-import { LucideIconPicker } from "@/components/shared/lucide-icon-picker";
+import { LucideIconPicker } from "@/components/shared-kit/icons/lucide-icon-picker";
 import { createKnowledgeFn, updateKnowledgeFn } from "@/server/serverFns/knowledge";
 import { knowledgeFormSchema, type KnowledgeFormValues } from "../schemas/knowledge-form";
 

package/src/components/knowledge/editor/doc-header.tsx

@@ -20,7 +20,7 @@ import { BookOpen, Clock, Dot, Plus } from 'lucide-react'
 import { cn } from '@/lib/utils'
 import { formatSaveTime } from '@/lib/time-format'
 import { useTimezone } from '@/providers/timezone-provider'
-import { UserAvatar } from '@/components/ui-shared'
+import { UserAvatar } from '@/components/shared-kit'
 import { TagSelector } from '@/plugins/core/tags/tag-selector'
 import { TagBadge } from '@/plugins/core/tags/tag-badge'
 import { listTagsFn } from '@/plugins/core/tags/serverFns'

package/src/components/knowledge-public/sharers-avatar-group.tsx

@@ -15,7 +15,7 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-import { UserAvatar } from '@/components/ui-shared'
+import { UserAvatar } from '@/components/shared-kit'
 import { AvatarGroup, AvatarGroupTooltip } from '@/components/magicui/components/animate/avatar-group'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
 import { cn } from '@/lib/utils'

package/src/components/layout/sidebar-03/__tests__/nav-workspace.test.tsx

@@ -63,7 +63,7 @@ vi.mock("@/lib/sidebar-utils", () => ({
   isParentActive: (pathname: string, target: string) => pathname.startsWith(target),
 }));
 
-vi.mock("@/components/shared/lucide-icon-picker/lucide-icon-by-name", () => ({
+vi.mock("@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name", () => ({
   LucideIconByName: ({ name }: any) => <span data-testid="project-icon">{name}</span>,
 }));
 

package/src/components/layout/sidebar-03/app-sidebar.tsx

@@ -33,7 +33,7 @@ import { NavKnowledge } from "@/components/layout/sidebar-03/nav-knowledge";
 import { NavWorkspace } from "@/components/layout/sidebar-03/nav-workspace";
 import { Logo } from "@/components/layout/sidebar-03/logo";
 import { UserMenu } from "@/components/layout/sidebar-03/user-menu";
-import { ThemeToggle } from "@/components/shared/theme-toggle";
+import { ThemeToggle } from "@/components/shared-kit/theme/theme-toggle";
 import { AnimatedThemeToggler } from '@/components/magicui/animated-theme-toggler'
 import { Badge } from "@/components/ui/badge"
 import { workspaceRoutes } from "@/config/sidebar-routes";

package/src/components/layout/sidebar-03/nav-workspace.tsx

@@ -28,7 +28,7 @@ import {
 } from "@/components/ui/sidebar";
 import { cn } from "@/lib/utils";
 import { isParentActive } from "@/lib/sidebar-utils";
-import { LucideIconByName } from "@/components/shared/lucide-icon-picker/lucide-icon-by-name";
+import { LucideIconByName } from "@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name";
 import { CreateWorkspaceDialog } from "@/components/workspace/create-workspace-dialog";
 import { useLiveQuery } from "@tanstack/react-db";
 import { workspacesCollection } from "@/lib/collections/reference/workspaces-collection";

package/src/components/layout/sidebar-03/user-menu.tsx

@@ -47,7 +47,7 @@ import { signOut, useSession } from "@/lib/auth/auth-client";
 import { useRouter, useMatches } from "@tanstack/react-router";
 import { useTranslation } from "react-i18next";
 import { getQueryClient } from "@/lib/query-client-seam";
-import { UserAvatar } from "@/components/ui-shared";
+import { UserAvatar } from "@/components/shared-kit";
 import type { AvatarConfig, ShapeType } from "@allbluecn/kernel";
 import { SparklesText } from "@/components/magicui/sparkles-text";
 

package/src/components/magicui/animated-theme-toggler.tsx

@@ -1 +1 @@
-export * from '@/components/ui-shared/animated-theme-toggler'
+export * from '@/components/shared-kit/theme/animated-theme-toggler'

package/src/components/magicui/grid-pattern.tsx

@@ -1 +1 @@
-export * from '@/components/ui-shared/grid-pattern'
+export * from '@/components/shared-kit/decorative/grid-pattern'

package/src/components/project/create-project-dialog.tsx

@@ -36,7 +36,7 @@ import {
   DialogHeader,
   DialogTitle,
 } from "@/components/ui/dialog";
-import { LucideIconPicker } from "@/components/shared/lucide-icon-picker";
+import { LucideIconPicker } from "@/components/shared-kit/icons/lucide-icon-picker";
 import { extractDisplayId, validateDisplayId } from "@/lib/project-display-id";
 import { checkDisplayIdAvailableFn, createProjectFn } from "@/server/serverFns/project";
 import { listWorkspacesBriefFn } from "@/server/serverFns/workspace";

package/src/components/project/invite-member-dialog.tsx

@@ -41,7 +41,7 @@ import {
 import { addProjectMemberFromTeamFn } from "@/server/serverFns/project";
 import { listTeamUsersFn } from "@/server/serverFns/team";
 import type { ProjectRole } from "@/types/project";
-import { UserAvatar } from "@/components/ui-shared";
+import { UserAvatar } from "@/components/shared-kit";
 
 interface AssignMemberDialogProps {
   open: boolean;

package/src/components/project/project-activity-list.tsx

@@ -17,7 +17,7 @@
 
 import { useTranslation } from "react-i18next"
 import { getClientI18n } from "@/i18n/client"
-import { UserAvatar } from "@/components/ui-shared";
+import { UserAvatar } from "@/components/shared-kit";
 import type { AvatarConfig, ShapeType } from "@allbluecn/kernel";
 import { cn } from "@/lib/utils";
 import { formatDate } from "@/lib/datetime";

package/src/components/project/project-member-manager.tsx

@@ -39,7 +39,7 @@ import {
   AlertDialogHeader,
   AlertDialogTitle,
 } from "@/components/ui/alert-dialog";
-import { UserAvatar } from "@/components/ui-shared";
+import { UserAvatar } from "@/components/shared-kit";
 import type { AvatarConfig, ShapeType } from "@allbluecn/kernel";
 import { InviteMemberDialog } from "./invite-member-dialog";
 import {

package/src/components/settings/personal-team/account/avatar/notion-avatar.tsx

@@ -15,6 +15,6 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-export { NotionAvatar as default } from "@/components/ui-shared"
-export { NotionAvatar } from "@/components/ui-shared"
+export { NotionAvatar as default } from "@/components/shared-kit"
+export { NotionAvatar } from "@/components/shared-kit"
 export type { ShapeType } from "@allbluecn/kernel"

package/src/components/settings/personal-team/team/team-member-list.tsx

@@ -15,7 +15,7 @@ import { useTranslation } from "react-i18next"
 import { cn } from "@/lib/utils"
 import { formatDate } from "@/lib/datetime"
 import { useTimezone } from "@/providers/timezone-provider"
-import { UserAvatar } from "@/components/ui-shared"
+import { UserAvatar } from "@/components/shared-kit"
 import type { AvatarConfig, ShapeType } from "@allbluecn/kernel"
 import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"

package/src/components/shadcn-space/blocks/hero-01/header.tsx

@@ -28,7 +28,7 @@ import { m } from "motion/react";
 import { InteractiveHoverButton } from "@/components/magicui/interactive-hover-button";
 import { useSession } from "@/lib/auth/auth-client";
 import { useRouter } from "@tanstack/react-router";
-import { ThemeToggle } from "@/components/shared/theme-toggle";
+import { ThemeToggle } from "@/components/shared-kit/theme/theme-toggle";
 import { AnimatedThemeToggler } from '@/components/magicui/animated-theme-toggler'
 
 export type NavigationSection = {

package/src/components/{ui-shared → shared-kit/auth}/auth-layout.tsx

@@ -16,7 +16,7 @@
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import type { ReactNode } from 'react'
-import { AnimatedThemeToggler } from './animated-theme-toggler'
+import { AnimatedThemeToggler } from '@/components/shared-kit/theme/animated-theme-toggler'
 
 interface AuthLayoutProps {
   children: ReactNode

package/src/components/{ui-shared → shared-kit/decorative}/grid-pattern.tsx

@@ -17,7 +17,7 @@
 
 import { useId } from "react"
 
-import { cn } from "./utils"
+import { cn } from "@/lib/utils"
 
 interface GridPatternProps extends React.SVGProps<SVGSVGElement> {
   width?: number

package/src/components/{ui-shared → shared-kit/dialogs}/name-confirm-dialog.tsx

@@ -17,12 +17,13 @@
 
 
 import { useState } from "react";
+import * as React from "react";
 import type { ReactNode } from "react";
 import { toast } from "sonner";
 import { useTranslation } from "react-i18next";
-import { Button } from "./button";
-import { Input } from "./input";
-import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import {
   Dialog,
   DialogContent,
@@ -30,7 +31,7 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle,
-} from "./dialog";
+} from "@/components/ui/dialog";
 
 interface NameConfirmDialogProps {
   open: boolean;
@@ -120,7 +121,7 @@ export function NameConfirmDialog({
             </p>
             <Input
               value={inputValue}
-              onChange={(e) => {
+              onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                 setInputValue(e.target.value);
                 setError("");
               }}