@coze-arch/cli 0.0.1-alpha.dffbaa → 0.0.1-alpha.f37dff

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 (63) hide show
  1. package/lib/__templates__/expo/.coze +7 -2
  2. package/lib/__templates__/expo/.cozeproj/scripts/dev_build.sh +46 -0
  3. package/lib/__templates__/expo/.cozeproj/scripts/dev_run.sh +220 -0
  4. package/lib/__templates__/expo/.cozeproj/scripts/prod_build.sh +47 -0
  5. package/lib/__templates__/expo/.cozeproj/scripts/prod_run.sh +34 -0
  6. package/lib/__templates__/expo/README.md +66 -7
  7. package/lib/__templates__/expo/_gitignore +1 -1
  8. package/lib/__templates__/expo/_npmrc +2 -4
  9. package/lib/__templates__/expo/client/app/_layout.tsx +1 -1
  10. package/lib/__templates__/expo/client/app/home.tsx +1 -0
  11. package/lib/__templates__/expo/client/app/index.tsx +1 -0
  12. package/lib/__templates__/expo/client/app.config.ts +75 -0
  13. package/lib/__templates__/expo/client/assets/images/coze-logo.png +0 -0
  14. package/lib/__templates__/expo/client/components/ThemedText.tsx +33 -0
  15. package/lib/__templates__/expo/client/components/ThemedView.tsx +38 -0
  16. package/lib/__templates__/expo/client/constants/theme.ts +780 -48
  17. package/lib/__templates__/expo/client/hooks/useColorScheme.ts +34 -1
  18. package/lib/__templates__/expo/client/hooks/useTheme.ts +1 -1
  19. package/lib/__templates__/expo/client/metro.config.js +121 -0
  20. package/lib/__templates__/expo/client/package.json +93 -0
  21. package/lib/__templates__/expo/client/screens/home/index.tsx +8 -38
  22. package/lib/__templates__/expo/client/screens/home/styles.ts +16 -52
  23. package/lib/__templates__/expo/client/tsconfig.json +24 -0
  24. package/lib/__templates__/expo/package.json +13 -103
  25. package/lib/__templates__/expo/pnpm-lock.yaml +421 -867
  26. package/lib/__templates__/expo/pnpm-workspace.yaml +3 -0
  27. package/lib/__templates__/expo/server/package.json +31 -0
  28. package/lib/__templates__/expo/{src → server/src}/index.ts +8 -2
  29. package/lib/__templates__/expo/server/tsconfig.json +24 -0
  30. package/lib/__templates__/expo/template.config.js +1 -0
  31. package/lib/__templates__/expo/tsconfig.json +1 -24
  32. package/lib/__templates__/nextjs/.coze +1 -0
  33. package/lib/__templates__/nextjs/next.config.ts +10 -0
  34. package/lib/__templates__/nextjs/package.json +2 -1
  35. package/lib/__templates__/nextjs/scripts/prepare.sh +9 -0
  36. package/lib/__templates__/nextjs/src/app/globals.css +99 -87
  37. package/lib/__templates__/nextjs/src/app/page.tsx +2 -3
  38. package/lib/__templates__/nextjs/src/components/ui/resizable.tsx +29 -22
  39. package/lib/__templates__/nextjs/src/components/ui/sidebar.tsx +228 -230
  40. package/lib/__templates__/nextjs/template.config.js +24 -0
  41. package/lib/__templates__/templates.json +61 -43
  42. package/lib/__templates__/vite/.coze +1 -0
  43. package/lib/__templates__/vite/eslint.config.mjs +9 -0
  44. package/lib/__templates__/vite/package.json +6 -3
  45. package/lib/__templates__/vite/pnpm-lock.yaml +961 -120
  46. package/lib/__templates__/vite/scripts/prepare.sh +9 -0
  47. package/lib/__templates__/vite/template.config.js +4 -0
  48. package/lib/cli.js +144 -31
  49. package/package.json +8 -3
  50. package/lib/__templates__/expo/.cozeproj/scripts/deploy_build.sh +0 -116
  51. package/lib/__templates__/expo/.cozeproj/scripts/deploy_run.sh +0 -239
  52. package/lib/__templates__/expo/app.json +0 -63
  53. package/lib/__templates__/expo/babel.config.js +0 -9
  54. package/lib/__templates__/expo/client/app/(tabs)/_layout.tsx +0 -43
  55. package/lib/__templates__/expo/client/app/(tabs)/home.tsx +0 -1
  56. package/lib/__templates__/expo/client/app/(tabs)/index.tsx +0 -7
  57. package/lib/__templates__/expo/client/app/+not-found.tsx +0 -79
  58. package/lib/__templates__/expo/client/index.js +0 -12
  59. package/lib/__templates__/expo/metro.config.js +0 -53
  60. package/lib/__templates__/nextjs/.vscode/settings.json +0 -121
  61. package/lib/__templates__/vite/.vscode/settings.json +0 -7
  62. /package/lib/__templates__/expo/{eslint-formatter-simple.mjs → client/eslint-formatter-simple.mjs} +0 -0
  63. /package/lib/__templates__/expo/{eslint.config.mjs → client/eslint.config.mjs} +0 -0
@@ -0,0 +1,3 @@
1
+ packages:
2
+ - client
3
+ - server
@@ -0,0 +1,31 @@
1
+ {
2
+ "name": "server",
3
+ "private": true,
4
+ "type": "module",
5
+ "scripts": {
6
+ "preinstall": "npx only-allow pnpm",
7
+ "dev": "NODE_ENV=development tsx ./src/index.ts",
8
+ "build": "pnpm exec esbuild src/index.ts --platform=node --packages=external --bundle --format=esm --outdir=dist",
9
+ "start": "NODE_ENV=production PORT=${PORT:-5000} node dist/index.js"
10
+ },
11
+ "dependencies": {
12
+ "express": "^4.22.1",
13
+ "cors": "^2.8.5",
14
+ "coze-coding-dev-sdk": "^0.5.5",
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"
21
+ },
22
+ "devDependencies": {
23
+ "@types/express": "^5.0.6",
24
+ "tsx": "^4.21.0",
25
+ "@types/multer": "^2.0.0",
26
+ "@types/pg": "^8.16.0",
27
+ "esbuild": "0.27.2",
28
+ "typescript": "^5.8.3",
29
+ "drizzle-kit": "^0.31.8"
30
+ }
31
+ }
@@ -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,
@@ -1,24 +1 @@
1
- {
2
- "extends": "expo/tsconfig.base",
3
- "compilerOptions": {
4
- "skipLibCheck": true,
5
- "jsx": "react-jsx",
6
- "baseUrl": ".",
7
- "strict": true,
8
- "noEmit": true,
9
- "paths": {
10
- "@/*": ["./client/*"]
11
- }
12
- },
13
- "include": ["**/*.ts", "**/*.tsx", ".expo/types/**/*.ts", "expo-env.d.ts"],
14
- "exclude": [
15
- "node_modules",
16
- "**/*.spec.ts",
17
- "**/*.test.ts",
18
- "**/*.spec.tsx",
19
- "**/*.test.tsx",
20
- "dist",
21
- "build",
22
- "client/.expo"
23
- ]
24
- }
1
+ {}
@@ -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
 
@@ -2,6 +2,16 @@ import type { NextConfig } from 'next';
2
2
 
3
3
  const nextConfig: NextConfig = {
4
4
  /* config options here */
5
+ allowedDevOrigins: ['*.dev.coze.site'],
6
+ images: {
7
+ remotePatterns: [
8
+ {
9
+ protocol: 'https',
10
+ hostname: 'lf3-static.bytednsdoc.com',
11
+ pathname: '/**',
12
+ },
13
+ ],
14
+ },
5
15
  };
6
16
 
7
17
  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",
@@ -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
@@ -1,59 +1,11 @@
1
1
  @import 'tailwindcss';
2
- @import "tw-animate-css";
2
+ @import 'tw-animate-css';
3
3
 
4
4
  @custom-variant dark (&:is(.dark *));
5
5
 
6
- :root {
7
- --background: 0 0% 100%;
8
- --foreground: 0 0% 9%;
9
- --card: 0 0% 100%;
10
- --card-foreground: 0 0% 9%;
11
- --popover: 0 0% 100%;
12
- --popover-foreground: 0 0% 9%;
13
- --primary: 0 0% 9%;
14
- --primary-foreground: 0 0% 98%;
15
- --secondary: 0 0% 96%;
16
- --secondary-foreground: 0 0% 9%;
17
- --muted: 0 0% 96%;
18
- --muted-foreground: 0 0% 45%;
19
- --accent: 0 0% 96%;
20
- --accent-foreground: 0 0% 9%;
21
- --destructive: 0 84% 60%;
22
- --destructive-foreground: 0 0% 98%;
23
- --border: 0 0% 90%;
24
- --input: 0 0% 90%;
25
- --ring: 0 0% 9%;
26
- --radius: 0.5rem;
27
- --sidebar: hsl(0 0% 98%);
28
- --sidebar-foreground: hsl(240 5.3% 26.1%);
29
- --sidebar-primary: hsl(240 5.9% 10%);
30
- --sidebar-primary-foreground: hsl(0 0% 98%);
31
- --sidebar-accent: hsl(240 4.8% 95.9%);
32
- --sidebar-accent-foreground: hsl(240 5.9% 10%);
33
- --sidebar-border: hsl(220 13% 91%);
34
- --sidebar-ring: hsl(217.2 91.2% 59.8%);
35
- }
36
-
37
6
  @theme inline {
38
- --color-background: hsl(var(--background));
39
- --color-foreground: hsl(var(--foreground));
40
- --color-card: hsl(var(--card));
41
- --color-card-foreground: hsl(var(--card-foreground));
42
- --color-popover: hsl(var(--popover));
43
- --color-popover-foreground: hsl(var(--popover-foreground));
44
- --color-primary: hsl(var(--primary));
45
- --color-primary-foreground: hsl(var(--primary-foreground));
46
- --color-secondary: hsl(var(--secondary));
47
- --color-secondary-foreground: hsl(var(--secondary-foreground));
48
- --color-muted: hsl(var(--muted));
49
- --color-muted-foreground: hsl(var(--muted-foreground));
50
- --color-accent: hsl(var(--accent));
51
- --color-accent-foreground: hsl(var(--accent-foreground));
52
- --color-destructive: hsl(var(--destructive));
53
- --color-destructive-foreground: hsl(var(--destructive-foreground));
54
- --color-border: hsl(var(--border));
55
- --color-input: hsl(var(--input));
56
- --color-ring: hsl(var(--ring));
7
+ --color-background: var(--background);
8
+ --color-foreground: var(--foreground);
57
9
  --font-sans: var(--font-geist-sans);
58
10
  --font-mono: var(--font-geist-mono);
59
11
  --color-sidebar-ring: var(--sidebar-ring);
@@ -64,47 +16,103 @@
64
16
  --color-sidebar-primary: var(--sidebar-primary);
65
17
  --color-sidebar-foreground: var(--sidebar-foreground);
66
18
  --color-sidebar: var(--sidebar);
19
+ --color-chart-5: var(--chart-5);
20
+ --color-chart-4: var(--chart-4);
21
+ --color-chart-3: var(--chart-3);
22
+ --color-chart-2: var(--chart-2);
23
+ --color-chart-1: var(--chart-1);
24
+ --color-ring: var(--ring);
25
+ --color-input: var(--input);
26
+ --color-border: var(--border);
27
+ --color-destructive: var(--destructive);
28
+ --color-accent-foreground: var(--accent-foreground);
29
+ --color-accent: var(--accent);
30
+ --color-muted-foreground: var(--muted-foreground);
31
+ --color-muted: var(--muted);
32
+ --color-secondary-foreground: var(--secondary-foreground);
33
+ --color-secondary: var(--secondary);
34
+ --color-primary-foreground: var(--primary-foreground);
35
+ --color-primary: var(--primary);
36
+ --color-popover-foreground: var(--popover-foreground);
37
+ --color-popover: var(--popover);
38
+ --color-card-foreground: var(--card-foreground);
39
+ --color-card: var(--card);
40
+ --radius-sm: calc(var(--radius) - 4px);
41
+ --radius-md: calc(var(--radius) - 2px);
42
+ --radius-lg: var(--radius);
43
+ --radius-xl: calc(var(--radius) + 4px);
44
+ --radius-2xl: calc(var(--radius) + 8px);
45
+ --radius-3xl: calc(var(--radius) + 12px);
46
+ --radius-4xl: calc(var(--radius) + 16px);
67
47
  }
68
48
 
69
- @media (prefers-color-scheme: dark) {
70
- :root {
71
- --background: 0 0% 4%;
72
- --foreground: 0 0% 93%;
73
- --card: 0 0% 4%;
74
- --card-foreground: 0 0% 93%;
75
- --popover: 0 0% 4%;
76
- --popover-foreground: 0 0% 93%;
77
- --primary: 0 0% 98%;
78
- --primary-foreground: 0 0% 9%;
79
- --secondary: 0 0% 15%;
80
- --secondary-foreground: 0 0% 98%;
81
- --muted: 0 0% 15%;
82
- --muted-foreground: 0 0% 64%;
83
- --accent: 0 0% 15%;
84
- --accent-foreground: 0 0% 98%;
85
- --destructive: 0 63% 31%;
86
- --destructive-foreground: 0 0% 98%;
87
- --border: 0 0% 15%;
88
- --input: 0 0% 15%;
89
- --ring: 0 0% 83%;
90
- }
91
- }
92
-
93
- body {
94
- background: hsl(var(--background));
95
- color: hsl(var(--foreground));
96
- font-family: Arial, Helvetica, sans-serif;
49
+ :root {
50
+ --radius: 0.625rem;
51
+ --background: oklch(1 0 0);
52
+ --foreground: oklch(0.145 0 0);
53
+ --card: oklch(1 0 0);
54
+ --card-foreground: oklch(0.145 0 0);
55
+ --popover: oklch(1 0 0);
56
+ --popover-foreground: oklch(0.145 0 0);
57
+ --primary: oklch(0.205 0 0);
58
+ --primary-foreground: oklch(0.985 0 0);
59
+ --secondary: oklch(0.97 0 0);
60
+ --secondary-foreground: oklch(0.205 0 0);
61
+ --muted: oklch(0.97 0 0);
62
+ --muted-foreground: oklch(0.556 0 0);
63
+ --accent: oklch(0.97 0 0);
64
+ --accent-foreground: oklch(0.205 0 0);
65
+ --destructive: oklch(0.577 0.245 27.325);
66
+ --border: oklch(0.922 0 0);
67
+ --input: oklch(0.922 0 0);
68
+ --ring: oklch(0.708 0 0);
69
+ --chart-1: oklch(0.646 0.222 41.116);
70
+ --chart-2: oklch(0.6 0.118 184.704);
71
+ --chart-3: oklch(0.398 0.07 227.392);
72
+ --chart-4: oklch(0.828 0.189 84.429);
73
+ --chart-5: oklch(0.769 0.188 70.08);
74
+ --sidebar: oklch(0.985 0 0);
75
+ --sidebar-foreground: oklch(0.145 0 0);
76
+ --sidebar-primary: oklch(0.205 0 0);
77
+ --sidebar-primary-foreground: oklch(0.985 0 0);
78
+ --sidebar-accent: oklch(0.97 0 0);
79
+ --sidebar-accent-foreground: oklch(0.205 0 0);
80
+ --sidebar-border: oklch(0.922 0 0);
81
+ --sidebar-ring: oklch(0.708 0 0);
97
82
  }
98
83
 
99
84
  .dark {
100
- --sidebar: hsl(240 5.9% 10%);
101
- --sidebar-foreground: hsl(240 4.8% 95.9%);
102
- --sidebar-primary: hsl(224.3 76.3% 48%);
103
- --sidebar-primary-foreground: hsl(0 0% 100%);
104
- --sidebar-accent: hsl(240 3.7% 15.9%);
105
- --sidebar-accent-foreground: hsl(240 4.8% 95.9%);
106
- --sidebar-border: hsl(240 3.7% 15.9%);
107
- --sidebar-ring: hsl(217.2 91.2% 59.8%);
85
+ --background: oklch(0.145 0 0);
86
+ --foreground: oklch(0.985 0 0);
87
+ --card: oklch(0.205 0 0);
88
+ --card-foreground: oklch(0.985 0 0);
89
+ --popover: oklch(0.205 0 0);
90
+ --popover-foreground: oklch(0.985 0 0);
91
+ --primary: oklch(0.922 0 0);
92
+ --primary-foreground: oklch(0.205 0 0);
93
+ --secondary: oklch(0.269 0 0);
94
+ --secondary-foreground: oklch(0.985 0 0);
95
+ --muted: oklch(0.269 0 0);
96
+ --muted-foreground: oklch(0.708 0 0);
97
+ --accent: oklch(0.269 0 0);
98
+ --accent-foreground: oklch(0.985 0 0);
99
+ --destructive: oklch(0.704 0.191 22.216);
100
+ --border: oklch(1 0 0 / 10%);
101
+ --input: oklch(1 0 0 / 15%);
102
+ --ring: oklch(0.556 0 0);
103
+ --chart-1: oklch(0.488 0.243 264.376);
104
+ --chart-2: oklch(0.696 0.17 162.48);
105
+ --chart-3: oklch(0.769 0.188 70.08);
106
+ --chart-4: oklch(0.627 0.265 303.9);
107
+ --chart-5: oklch(0.645 0.246 16.439);
108
+ --sidebar: oklch(0.205 0 0);
109
+ --sidebar-foreground: oklch(0.985 0 0);
110
+ --sidebar-primary: oklch(0.488 0.243 264.376);
111
+ --sidebar-primary-foreground: oklch(0.985 0 0);
112
+ --sidebar-accent: oklch(0.269 0 0);
113
+ --sidebar-accent-foreground: oklch(0.985 0 0);
114
+ --sidebar-border: oklch(1 0 0 / 10%);
115
+ --sidebar-ring: oklch(0.556 0 0);
108
116
  }
109
117
 
110
118
  @layer base {
@@ -115,3 +123,7 @@ body {
115
123
  @apply bg-background text-foreground;
116
124
  }
117
125
  }
126
+
127
+ body {
128
+ @apply font-sans;
129
+ }
@@ -1,4 +1,5 @@
1
1
  import type { Metadata } from 'next';
2
+ import Image from 'next/image';
2
3
 
3
4
  export const metadata: Metadata = {
4
5
  title: '扣子编程 - AI 开发伙伴',
@@ -12,14 +13,12 @@ export default function Home() {
12
13
  <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
14
  {/* 头部:Logo 和 产品名称 */}
14
15
  <div className="flex items-center gap-3">
15
- {/* 注意:生产环境建议使用 next/image 并配置 remotePatterns */}
16
- <img
16
+ <Image
17
17
  className="dark:invert"
18
18
  src="https://lf3-static.bytednsdoc.com/obj/eden-cn/hkpzboz/coze_logo.png"
19
19
  alt="扣子编程 Logo"
20
20
  width={40}
21
21
  height={40}
22
- style={{ width: '40px', height: '40px', objectFit: 'contain' }}
23
22
  />
24
23
  <span className="text-xl font-bold tracking-tight text-black dark:text-zinc-50">
25
24
  扣子编程
@@ -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 };