@coze-arch/cli 0.0.1-alpha.f9be02 → 0.0.1-alpha.ff64d9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/lib/__templates__/expo/.coze +1 -1
  2. package/lib/__templates__/expo/.cozeproj/scripts/dev_build.sh +19 -82
  3. package/lib/__templates__/expo/.cozeproj/scripts/dev_run.sh +62 -81
  4. package/lib/__templates__/expo/.cozeproj/scripts/prod_build.sh +2 -2
  5. package/lib/__templates__/expo/.cozeproj/scripts/prod_run.sh +2 -2
  6. package/lib/__templates__/expo/.cozeproj/scripts/server_dev_run.sh +45 -0
  7. package/lib/__templates__/expo/README.md +66 -7
  8. package/lib/__templates__/expo/client/app/_layout.tsx +33 -0
  9. package/lib/__templates__/expo/client/app/demo.tsx +1 -0
  10. package/lib/__templates__/expo/client/app/index.tsx +1 -0
  11. package/lib/__templates__/expo/client/app.config.ts +64 -60
  12. package/lib/__templates__/expo/client/{src/constants → constants}/theme.ts +22 -18
  13. package/lib/__templates__/expo/client/declarations.d.ts +5 -0
  14. package/lib/__templates__/expo/client/hooks/useColorScheme.ts +34 -0
  15. package/lib/__templates__/expo/client/package.json +3 -2
  16. package/lib/__templates__/expo/client/screens/demo/index.tsx +25 -0
  17. package/lib/__templates__/expo/client/screens/demo/styles.ts +28 -0
  18. package/lib/__templates__/expo/client/tsconfig.json +1 -1
  19. package/lib/__templates__/expo/package.json +4 -98
  20. package/lib/__templates__/expo/pnpm-lock.yaml +376 -577
  21. package/lib/__templates__/expo/server/package.json +18 -3
  22. package/lib/__templates__/expo/server/src/index.ts +8 -2
  23. package/lib/__templates__/expo/server/tsconfig.json +24 -0
  24. package/lib/__templates__/expo/template.config.js +1 -0
  25. package/lib/__templates__/nextjs/.coze +1 -0
  26. package/lib/__templates__/nextjs/_npmrc +1 -0
  27. package/lib/__templates__/nextjs/next.config.ts +12 -0
  28. package/lib/__templates__/nextjs/package.json +3 -2
  29. package/lib/__templates__/nextjs/pnpm-lock.yaml +13 -5
  30. package/lib/__templates__/nextjs/scripts/prepare.sh +9 -0
  31. package/lib/__templates__/nextjs/src/app/globals.css +10 -2
  32. package/lib/__templates__/nextjs/src/app/layout.tsx +1 -12
  33. package/lib/__templates__/nextjs/src/app/page.tsx +35 -23
  34. package/lib/__templates__/nextjs/src/components/ui/resizable.tsx +29 -22
  35. package/lib/__templates__/nextjs/src/components/ui/sidebar.tsx +228 -230
  36. package/lib/__templates__/nextjs/template.config.js +30 -0
  37. package/lib/__templates__/templates.json +61 -43
  38. package/lib/__templates__/vite/.coze +1 -0
  39. package/lib/__templates__/vite/_npmrc +1 -0
  40. package/lib/__templates__/vite/eslint.config.mjs +9 -0
  41. package/lib/__templates__/vite/package.json +5 -1
  42. package/lib/__templates__/vite/pnpm-lock.yaml +3481 -14
  43. package/lib/__templates__/vite/scripts/prepare.sh +9 -0
  44. package/lib/__templates__/vite/src/main.ts +1 -2
  45. package/lib/__templates__/vite/template.config.js +28 -4
  46. package/lib/cli.js +201 -57
  47. package/package.json +5 -3
  48. package/lib/__templates__/expo/client/src/app/_layout.tsx +0 -33
  49. package/lib/__templates__/expo/client/src/app/index.ts +0 -1
  50. package/lib/__templates__/expo/client/src/hooks/useColorScheme.ts +0 -1
  51. package/lib/__templates__/expo/client/src/screens/home/index.tsx +0 -50
  52. package/lib/__templates__/expo/client/src/screens/home/styles.ts +0 -60
  53. package/lib/__templates__/nextjs/.vscode/settings.json +0 -121
  54. package/lib/__templates__/vite/.vscode/settings.json +0 -7
  55. /package/lib/__templates__/expo/client/{src/assets → assets}/fonts/SpaceMono-Regular.ttf +0 -0
  56. /package/lib/__templates__/expo/client/{src/assets → assets}/images/adaptive-icon.png +0 -0
  57. /package/lib/__templates__/expo/client/{src/assets → assets}/images/default-avatar.png +0 -0
  58. /package/lib/__templates__/expo/client/{src/assets → assets}/images/favicon.png +0 -0
  59. /package/lib/__templates__/expo/client/{src/assets → assets}/images/icon.png +0 -0
  60. /package/lib/__templates__/expo/client/{src/assets → assets}/images/partial-react-logo.png +0 -0
  61. /package/lib/__templates__/expo/client/{src/assets → assets}/images/react-logo.png +0 -0
  62. /package/lib/__templates__/expo/client/{src/assets → assets}/images/react-logo@2x.png +0 -0
  63. /package/lib/__templates__/expo/client/{src/assets → assets}/images/react-logo@3x.png +0 -0
  64. /package/lib/__templates__/expo/client/{src/assets → assets}/images/splash-icon.png +0 -0
  65. /package/lib/__templates__/expo/client/{src/components → components}/Screen.tsx +0 -0
  66. /package/lib/__templates__/expo/client/{src/components → components}/SmartDateInput.tsx +0 -0
  67. /package/lib/__templates__/expo/client/{src/components → components}/ThemedText.tsx +0 -0
  68. /package/lib/__templates__/expo/client/{src/components → components}/ThemedView.tsx +0 -0
  69. /package/lib/__templates__/expo/client/{src/contexts → contexts}/AuthContext.tsx +0 -0
  70. /package/lib/__templates__/expo/client/{src/hooks → hooks}/useTheme.ts +0 -0
  71. /package/lib/__templates__/expo/client/{src/utils → utils}/index.ts +0 -0
@@ -1,17 +1,32 @@
1
1
  {
2
2
  "name": "server",
3
3
  "private": true,
4
+ "type": "module",
4
5
  "scripts": {
5
6
  "preinstall": "npx only-allow pnpm",
6
- "dev": "NODE_ENV=development tsx ./src/index.ts",
7
+ "dev": "bash ../.cozeproj/scripts/server_dev_run.sh",
7
8
  "build": "pnpm exec esbuild src/index.ts --platform=node --packages=external --bundle --format=esm --outdir=dist",
8
9
  "start": "NODE_ENV=production PORT=${PORT:-5000} node dist/index.js"
9
10
  },
10
11
  "dependencies": {
11
- "express": "^4.22.1"
12
+ "express": "^4.22.1",
13
+ "cors": "^2.8.5",
14
+ "coze-coding-dev-sdk": "^0.7.2",
15
+ "dayjs": "^1.11.19",
16
+ "drizzle-orm": "^0.45.1",
17
+ "drizzle-zod": "^0.8.3",
18
+ "multer": "^2.0.2",
19
+ "pg": "^8.16.3",
20
+ "zod": "^4.2.1"
12
21
  },
13
22
  "devDependencies": {
23
+ "@types/cors": "^2.8.19",
14
24
  "@types/express": "^5.0.6",
15
- "tsx": "^4.21.0"
25
+ "tsx": "^4.21.0",
26
+ "@types/multer": "^2.0.0",
27
+ "@types/pg": "^8.16.0",
28
+ "esbuild": "0.27.2",
29
+ "typescript": "^5.8.3",
30
+ "drizzle-kit": "^0.31.8"
16
31
  }
17
32
  }
@@ -1,12 +1,18 @@
1
1
  import express from "express";
2
+ import cors from "cors";
2
3
 
3
4
  const app = express();
4
5
  const port = process.env.PORT || 9091;
5
6
 
6
- app.get('/api/v1/ping', (req, res) => {
7
- res.status(200).json({ message: 'connected' });
7
+ // Middleware
8
+ app.use(cors());
9
+ app.use(express.json());
10
+
11
+ app.get('/api/v1/health', (req, res) => {
12
+ res.status(200).json({ status: 'ok' });
8
13
  });
9
14
 
15
+
10
16
  app.listen(port, () => {
11
17
  console.log(`Server listening at http://localhost:${port}/`);
12
18
  });
@@ -0,0 +1,24 @@
1
+ {
2
+ "$schema": "https://www.schemastore.org/tsconfig",
3
+ "compilerOptions": {
4
+ "lib": [
5
+ "es2024",
6
+ "ESNext.Array",
7
+ "ESNext.Collection",
8
+ "ESNext.Iterator",
9
+ "ESNext.Promise"
10
+ ],
11
+ "module": "preserve",
12
+ "target": "es2024",
13
+
14
+ "strict": true,
15
+ "esModuleInterop": true,
16
+ "skipLibCheck": true,
17
+ "moduleResolution": "bundler",
18
+
19
+ "rewriteRelativeImportExtensions": true,
20
+ "erasableSyntaxOnly": true,
21
+ "verbatimModuleSyntax": true
22
+ },
23
+ "include": ["src"]
24
+ }
@@ -29,6 +29,7 @@ export const paramsSchema = {
29
29
  };
30
30
 
31
31
  const config = {
32
+ description: 'Expo template for React Native applications',
32
33
  paramsSchema,
33
34
  defaultParams: {
34
35
  port: 9090,
@@ -2,6 +2,7 @@
2
2
  requires = ["nodejs-24"]
3
3
 
4
4
  [dev]
5
+ build = ["bash", "./scripts/prepare.sh"]
5
6
  run = ["bash", "./scripts/dev.sh"]
6
7
  deps = ["git"] # -> apt install git
7
8
 
@@ -1,3 +1,4 @@
1
+ loglevel=error
1
2
  registry=https://registry.npmmirror.com
2
3
 
3
4
  strictStorePkgContentCheck=false
@@ -1,7 +1,19 @@
1
1
  import type { NextConfig } from 'next';
2
+ import path from 'path';
2
3
 
3
4
  const nextConfig: NextConfig = {
5
+ outputFileTracingRoot: path.resolve(__dirname, '../../'),
4
6
  /* config options here */
7
+ allowedDevOrigins: ['*.dev.coze.site'],
8
+ images: {
9
+ remotePatterns: [
10
+ {
11
+ protocol: 'https',
12
+ hostname: 'lf-coze-web-cdn.coze.cn',
13
+ pathname: '/**',
14
+ },
15
+ ],
16
+ },
5
17
  };
6
18
 
7
19
  export default nextConfig;
@@ -7,7 +7,8 @@
7
7
  "dev": "bash ./scripts/dev.sh",
8
8
  "preinstall": "npx only-allow pnpm",
9
9
  "lint": "eslint",
10
- "start": "bash ./scripts/start.sh"
10
+ "start": "bash ./scripts/start.sh",
11
+ "ts-check": "tsc -p tsconfig.json"
11
12
  },
12
13
  "dependencies": {
13
14
  "@aws-sdk/client-s3": "^3.958.0",
@@ -42,7 +43,7 @@
42
43
  "class-variance-authority": "^0.7.1",
43
44
  "clsx": "^2.1.1",
44
45
  "cmdk": "^1.1.1",
45
- "coze-coding-dev-sdk": "^0.5.2",
46
+ "coze-coding-dev-sdk": "^0.7.0",
46
47
  "date-fns": "^4.1.0",
47
48
  "drizzle-kit": "^0.31.8",
48
49
  "drizzle-orm": "^0.45.1",
@@ -105,8 +105,8 @@ importers:
105
105
  specifier: ^1.1.1
106
106
  version: 1.1.1(@types/react-dom@19.2.3(@types/react@19.2.7))(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
107
107
  coze-coding-dev-sdk:
108
- specifier: ^0.5.2
109
- version: 0.5.4(@types/pg@8.16.0)(openai@6.15.0(zod@4.3.5))
108
+ specifier: ^0.7.0
109
+ version: 0.7.2(@types/pg@8.16.0)(openai@6.15.0(zod@4.3.5))
110
110
  date-fns:
111
111
  specifier: ^4.1.0
112
112
  version: 4.1.0
@@ -2747,8 +2747,8 @@ packages:
2747
2747
  typescript:
2748
2748
  optional: true
2749
2749
 
2750
- coze-coding-dev-sdk@0.5.4:
2751
- resolution: {integrity: sha512-nIH2hMFlO2PSnqdslFzOITK+2FhR64caoYFuzy2ma+ceu0o2Spe7tLYLIsyUc42Prr5gXqk4MZESQqpXD34ZwQ==}
2750
+ coze-coding-dev-sdk@0.7.2:
2751
+ resolution: {integrity: sha512-IAAbI8W6MHL95BV/OmiacM2aMzkruyBwUMsvzJk/9jBT9vra2xiUC5ggS5xFi7V7MrL5VqfLv9ZlWSjcOAVRpw==}
2752
2752
  engines: {node: '>=18.0.0'}
2753
2753
  hasBin: true
2754
2754
 
@@ -4820,6 +4820,11 @@ packages:
4820
4820
  resolution: {integrity: sha512-kXuRi1mtaKMrsLUxz3sQYvVl37B0Ns6MzfrtV5DvJceE9bPyspOqk9xxv7XbZWcfLWbFmm997vl83qUWVJA64w==}
4821
4821
  engines: {node: '>=16'}
4822
4822
 
4823
+ transliteration@2.6.0:
4824
+ resolution: {integrity: sha512-T6frfMj7N5xNK0l+duIzIWKxkc9ewG72uv7NeOs4dIoysqTnYpwxeVEE5qYdKKmy7hby55ah0wNUoMaLsB2Zjw==}
4825
+ engines: {node: '>=20.0.0'}
4826
+ hasBin: true
4827
+
4823
4828
  ts-api-utils@2.3.0:
4824
4829
  resolution: {integrity: sha512-6eg3Y9SF7SsAvGzRHQvvc1skDAhwI4YQ32ui1scxD1Ccr0G5qIIbUBT3pFTKX8kmWIQClHobtUdNuaBgwdfdWg==}
4825
4830
  engines: {node: '>=18.12'}
@@ -7931,7 +7936,7 @@ snapshots:
7931
7936
  optionalDependencies:
7932
7937
  typescript: 5.9.3
7933
7938
 
7934
- coze-coding-dev-sdk@0.5.4(@types/pg@8.16.0)(openai@6.15.0(zod@4.3.5)):
7939
+ coze-coding-dev-sdk@0.7.2(@types/pg@8.16.0)(openai@6.15.0(zod@4.3.5)):
7935
7940
  dependencies:
7936
7941
  '@aws-sdk/client-s3': 3.962.0
7937
7942
  '@aws-sdk/lib-storage': 3.962.0(@aws-sdk/client-s3@3.962.0)
@@ -7944,6 +7949,7 @@ snapshots:
7944
7949
  drizzle-orm: 0.45.1(@types/pg@8.16.0)(pg@8.16.3)
7945
7950
  ora: 9.0.0
7946
7951
  pg: 8.16.3
7952
+ transliteration: 2.6.0
7947
7953
  transitivePeerDependencies:
7948
7954
  - '@aws-sdk/client-rds-data'
7949
7955
  - '@cloudflare/workers-types'
@@ -10186,6 +10192,8 @@ snapshots:
10186
10192
  dependencies:
10187
10193
  tldts: 7.0.19
10188
10194
 
10195
+ transliteration@2.6.0: {}
10196
+
10189
10197
  ts-api-utils@2.3.0(typescript@5.9.3):
10190
10198
  dependencies:
10191
10199
  typescript: 5.9.3
@@ -0,0 +1,9 @@
1
+ #!/bin/bash
2
+ set -Eeuo pipefail
3
+
4
+ COZE_WORKSPACE_PATH="${COZE_WORKSPACE_PATH:-$(pwd)}"
5
+
6
+ cd "${COZE_WORKSPACE_PATH}"
7
+
8
+ echo "Installing dependencies..."
9
+ pnpm install --prefer-frozen-lockfile --prefer-offline --loglevel debug --reporter=append-only
@@ -6,8 +6,6 @@
6
6
  @theme inline {
7
7
  --color-background: var(--background);
8
8
  --color-foreground: var(--foreground);
9
- --font-sans: var(--font-geist-sans);
10
- --font-mono: var(--font-geist-mono);
11
9
  --color-sidebar-ring: var(--sidebar-ring);
12
10
  --color-sidebar-border: var(--sidebar-border);
13
11
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
@@ -44,6 +42,16 @@
44
42
  --radius-2xl: calc(var(--radius) + 8px);
45
43
  --radius-3xl: calc(var(--radius) + 12px);
46
44
  --radius-4xl: calc(var(--radius) + 16px);
45
+ --font-sans:
46
+ 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', ui-sans-serif,
47
+ system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
48
+ 'Helvetica Neue', Arial, sans-serif;
49
+ --font-mono:
50
+ ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
51
+ 'Courier New', monospace;
52
+ --font-serif:
53
+ 'Noto Serif SC', 'Songti SC', 'SimSun', ui-serif, Georgia, Cambria,
54
+ 'Times New Roman', Times, serif;
47
55
  }
48
56
 
49
57
  :root {
@@ -1,17 +1,6 @@
1
1
  import type { Metadata } from 'next';
2
- import { Geist, Geist_Mono } from 'next/font/google';
3
2
  import './globals.css';
4
3
 
5
- const geistSans = Geist({
6
- variable: '--font-geist-sans',
7
- subsets: ['latin'],
8
- });
9
-
10
- const geistMono = Geist_Mono({
11
- variable: '--font-geist-mono',
12
- subsets: ['latin'],
13
- });
14
-
15
4
  export const metadata: Metadata = {
16
5
  title: {
17
6
  default: '新应用 | 扣子编程',
@@ -74,7 +63,7 @@ export default function RootLayout({
74
63
  return (
75
64
  <html lang="en">
76
65
  <body
77
- className={`${geistSans.variable} ${geistMono.variable} antialiased`}
66
+ className={`antialiased`}
78
67
  >
79
68
  {children}
80
69
  </body>
@@ -1,4 +1,6 @@
1
1
  import type { Metadata } from 'next';
2
+ import Image from 'next/image';
3
+ import { Button } from '@/components/ui/button';
2
4
 
3
5
  export const metadata: Metadata = {
4
6
  title: '扣子编程 - AI 开发伙伴',
@@ -7,31 +9,29 @@ export const metadata: Metadata = {
7
9
 
8
10
  export default function Home() {
9
11
  return (
10
- <div className="flex min-h-screen items-center justify-center bg-white text-black transition-colors duration-300 dark:bg-black dark:text-white">
12
+ <div className="flex min-h-screen items-center justify-center bg-background text-foreground transition-colors duration-300 dark:bg-background dark:text-foreground">
11
13
  {/* 主容器 */}
12
14
  <main className="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between px-16 py-32 sm:items-start">
13
15
  {/* 头部:Logo 和 产品名称 */}
14
16
  <div className="flex items-center gap-3">
15
- {/* 注意:生产环境建议使用 next/image 并配置 remotePatterns */}
16
- <img
17
- className="dark:invert"
18
- src="https://lf3-static.bytednsdoc.com/obj/eden-cn/hkpzboz/coze_logo.png"
17
+ <Image
18
+ src="https://lf-coze-web-cdn.coze.cn/obj/eden-cn/lm-lgvj/ljhwZthlaukjlkulzlp/favicon.svg"
19
19
  alt="扣子编程 Logo"
20
20
  width={40}
21
21
  height={40}
22
- style={{ width: '40px', height: '40px', objectFit: 'contain' }}
22
+ unoptimized
23
23
  />
24
- <span className="text-xl font-bold tracking-tight text-black dark:text-zinc-50">
24
+ <span className="text-xl font-bold tracking-tight text-foreground dark:text-foreground">
25
25
  扣子编程
26
26
  </span>
27
27
  </div>
28
28
 
29
29
  {/* 中间内容区:主标题和副标题 */}
30
30
  <div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
31
- <h1 className="max-w-xl text-4xl font-semibold leading-tight tracking-tight text-black dark:text-zinc-50">
31
+ <h1 className="max-w-xl text-4xl font-semibold leading-tight tracking-tight text-foreground dark:text-foreground">
32
32
  扣子编程,你的 AI 开发伙伴已就位
33
33
  </h1>
34
- <p className="max-w-2xl text-lg leading-8 text-zinc-600 dark:text-zinc-400">
34
+ <p className="max-w-2xl text-lg leading-8 text-muted-foreground dark:text-muted-foreground">
35
35
  当前是空白入口文件,项目正在开发中,请稍候...
36
36
  <br />
37
37
  开发完成后界面将自动更新。如未自动更新成功,可以手动点击右上角刷新或重启按钮查看效果。
@@ -41,24 +41,36 @@ export default function Home() {
41
41
  {/* 底部按钮区 */}
42
42
  <div className="flex w-full flex-col gap-4 text-base font-medium sm:w-auto sm:flex-row">
43
43
  {/* 按钮 1:前往首页 */}
44
- <a
45
- className="flex h-12 w-full min-w-[160px] items-center justify-center gap-2 rounded-full bg-black px-8 text-white transition-colors hover:bg-zinc-800 dark:bg-white dark:text-black dark:hover:bg-zinc-200 md:w-auto"
46
- href="https://code.coze.cn/"
47
- target="_blank"
48
- rel="noopener noreferrer"
44
+ <Button
45
+ asChild
46
+ variant="default"
47
+ size="lg"
48
+ className="h-12 min-w-[160px] rounded-full px-8"
49
49
  >
50
- 前往首页
51
- </a>
50
+ <a
51
+ href="https://code.coze.cn/"
52
+ target="_blank"
53
+ rel="noopener noreferrer"
54
+ >
55
+ 前往首页
56
+ </a>
57
+ </Button>
52
58
 
53
59
  {/* 按钮 2:查看文档 */}
54
- <a
55
- className="flex h-12 w-full min-w-[160px] items-center justify-center rounded-full border border-solid border-black/[.08] px-8 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-auto"
56
- href="https://docs.coze.cn/"
57
- target="_blank"
58
- rel="noopener noreferrer"
60
+ <Button
61
+ asChild
62
+ variant="outline"
63
+ size="lg"
64
+ className="h-12 min-w-[160px] rounded-full px-8"
59
65
  >
60
- 查看文档
61
- </a>
66
+ <a
67
+ href="https://docs.coze.cn/"
68
+ target="_blank"
69
+ rel="noopener noreferrer"
70
+ >
71
+ 查看文档
72
+ </a>
73
+ </Button>
62
74
  </div>
63
75
  </main>
64
76
  </div>
@@ -1,46 +1,53 @@
1
- "use client"
1
+ 'use client';
2
2
 
3
- import * as React from "react"
4
- import { GripVerticalIcon } from "lucide-react"
5
- import * as ResizablePrimitive from "react-resizable-panels"
3
+ import { GripVerticalIcon } from 'lucide-react';
4
+ import {
5
+ Group,
6
+ Panel,
7
+ Separator,
8
+ type GroupProps,
9
+ type PanelProps,
10
+ type SeparatorProps,
11
+ } from 'react-resizable-panels';
6
12
 
7
- import { cn } from "@/lib/utils"
13
+ import { cn } from '@/lib/utils';
8
14
 
9
15
  function ResizablePanelGroup({
10
16
  className,
17
+ orientation = 'horizontal',
11
18
  ...props
12
- }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) {
19
+ }: GroupProps) {
13
20
  return (
14
- <ResizablePrimitive.PanelGroup
21
+ <Group
15
22
  data-slot="resizable-panel-group"
23
+ data-panel-group-direction={orientation}
24
+ orientation={orientation}
16
25
  className={cn(
17
- "flex h-full w-full data-[panel-group-direction=vertical]:flex-col",
18
- className
26
+ 'flex h-full w-full data-[panel-group-direction=vertical]:flex-col',
27
+ className,
19
28
  )}
20
29
  {...props}
21
30
  />
22
- )
31
+ );
23
32
  }
24
33
 
25
- function ResizablePanel({
26
- ...props
27
- }: React.ComponentProps<typeof ResizablePrimitive.Panel>) {
28
- return <ResizablePrimitive.Panel data-slot="resizable-panel" {...props} />
34
+ function ResizablePanel({ ...props }: PanelProps) {
35
+ return <Panel data-slot="resizable-panel" {...props} />;
29
36
  }
30
37
 
31
38
  function ResizableHandle({
32
39
  withHandle,
33
40
  className,
34
41
  ...props
35
- }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
36
- withHandle?: boolean
42
+ }: SeparatorProps & {
43
+ withHandle?: boolean;
37
44
  }) {
38
45
  return (
39
- <ResizablePrimitive.PanelResizeHandle
46
+ <Separator
40
47
  data-slot="resizable-handle"
41
48
  className={cn(
42
- "bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90",
43
- className
49
+ 'bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90',
50
+ className,
44
51
  )}
45
52
  {...props}
46
53
  >
@@ -49,8 +56,8 @@ function ResizableHandle({
49
56
  <GripVerticalIcon className="size-2.5" />
50
57
  </div>
51
58
  )}
52
- </ResizablePrimitive.PanelResizeHandle>
53
- )
59
+ </Separator>
60
+ );
54
61
  }
55
62
 
56
- export { ResizablePanelGroup, ResizablePanel, ResizableHandle }
63
+ export { ResizablePanelGroup, ResizablePanel, ResizableHandle };