cryptis-video-editor 0.1.0
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.
- package/README.md +58 -0
- package/package.json +137 -0
package/README.md
ADDED
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
<p align="center">
|
|
2
|
+
<a href="https://github.com/designcombo/react-video-editor">
|
|
3
|
+
<img width="150px" height="150px" src="https://cdn.designcombo.dev/combo-logo-black.png"/>
|
|
4
|
+
</a>
|
|
5
|
+
</p>
|
|
6
|
+
<h1 align="center">React Video Editor</h1>
|
|
7
|
+
|
|
8
|
+
<div align="center">
|
|
9
|
+
|
|
10
|
+
Video Editor application using React and TypeScript.
|
|
11
|
+
|
|
12
|
+
<p align="center">
|
|
13
|
+
<a href="https://designcombo.dev/">Combo</a>
|
|
14
|
+
ยท
|
|
15
|
+
<a href="https://discord.gg/jrZs3wZyM5">Discord</a>
|
|
16
|
+
ยท
|
|
17
|
+
<a href="https://github.com/designcombo/react-video-editor">X</a>
|
|
18
|
+
</p>
|
|
19
|
+
</div>
|
|
20
|
+
|
|
21
|
+
[](https://github.com/designcombo/react-video-editor)
|
|
22
|
+
|
|
23
|
+
## โจ Features
|
|
24
|
+
|
|
25
|
+
- ๐ฌ Timeline Editing: Arrange and trim media on a visual timeline.
|
|
26
|
+
- ๐ Effects and Transitions: Apply visual effects, filters, and transitions.
|
|
27
|
+
- ๐ Multi-track Support: Edit multiple video and audio tracks simultaneously.
|
|
28
|
+
- ๐ค Export Options: Save videos in various resolutions and formats.
|
|
29
|
+
- ๐ Real-time Preview: See immediate previews of edits.
|
|
30
|
+
|
|
31
|
+
## ๐ See It in Action
|
|
32
|
+
|
|
33
|
+
Check out the deployed version here: [React Video Editor Live Demo](https://video.designcombo.dev/)
|
|
34
|
+
|
|
35
|
+
## โจ๏ธ Development
|
|
36
|
+
|
|
37
|
+
### Environment Variables
|
|
38
|
+
|
|
39
|
+
Create a `.env` file in the project root and add the following:
|
|
40
|
+
|
|
41
|
+
```env
|
|
42
|
+
PEXELS_API_KEY=""
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
Clone locally:
|
|
46
|
+
|
|
47
|
+
```bash
|
|
48
|
+
git clone git@github.com:designcombo/react-video-editor.git
|
|
49
|
+
cd react-video-editor
|
|
50
|
+
pnpm install
|
|
51
|
+
pnpm dev
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
Open your browser and visit http://localhost:3000 , see more at [Development](https://github.com/designcombo/react-video-editor).
|
|
55
|
+
|
|
56
|
+
## ๐ License
|
|
57
|
+
|
|
58
|
+
Copyright ยฉ 2025 [DesignCombo](https://designcombo.dev/).
|
package/package.json
ADDED
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "cryptis-video-editor",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "A video editor component library for React",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.esm.js",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"files": [
|
|
9
|
+
"dist",
|
|
10
|
+
"README.md"
|
|
11
|
+
],
|
|
12
|
+
"scripts": {
|
|
13
|
+
"dev": "next dev",
|
|
14
|
+
"build": "next build",
|
|
15
|
+
"prepublishOnly": "npm run build",
|
|
16
|
+
"start": "next start",
|
|
17
|
+
"lint": "next lint",
|
|
18
|
+
"migrate:up": "tsx scripts/migrate.ts up",
|
|
19
|
+
"migrate:down": "tsx scripts/migrate.ts down",
|
|
20
|
+
"cleanup-db": "tsx scripts/cleanup-db.ts",
|
|
21
|
+
"format": "biome format . --write"
|
|
22
|
+
},
|
|
23
|
+
"keywords": [
|
|
24
|
+
"react",
|
|
25
|
+
"video-editor",
|
|
26
|
+
"components"
|
|
27
|
+
],
|
|
28
|
+
"author": "Your Name",
|
|
29
|
+
"license": "MIT",
|
|
30
|
+
"peerDependencies": {
|
|
31
|
+
"react": "^18.0.0",
|
|
32
|
+
"react-dom": "^18.0.0"
|
|
33
|
+
},
|
|
34
|
+
"dependencies": {
|
|
35
|
+
"@designcombo/animations": "^5.4.2",
|
|
36
|
+
"@designcombo/events": "^1.0.2",
|
|
37
|
+
"@designcombo/frames": "^0.0.3",
|
|
38
|
+
"@designcombo/state": "^5.4.2",
|
|
39
|
+
"@designcombo/timeline": "^5.4.2",
|
|
40
|
+
"@designcombo/transitions": "^5.4.2",
|
|
41
|
+
"@emotion/react": "^11.14.0",
|
|
42
|
+
"@emotion/styled": "^11.14.0",
|
|
43
|
+
"@google/genai": "^1.6.0",
|
|
44
|
+
"@hookform/resolvers": "^3.9.0",
|
|
45
|
+
"@interactify/toolkit": "^1.0.0",
|
|
46
|
+
"@radix-ui/react-accordion": "^1.2.11",
|
|
47
|
+
"@radix-ui/react-avatar": "^1.1.9",
|
|
48
|
+
"@radix-ui/react-checkbox": "^1.3.3",
|
|
49
|
+
"@radix-ui/react-collapsible": "^1.1.10",
|
|
50
|
+
"@radix-ui/react-dialog": "^1.1.14",
|
|
51
|
+
"@radix-ui/react-dropdown-menu": "^2.1.14",
|
|
52
|
+
"@radix-ui/react-label": "^2.1.6",
|
|
53
|
+
"@radix-ui/react-popover": "^1.1.14",
|
|
54
|
+
"@radix-ui/react-progress": "^1.1.0",
|
|
55
|
+
"@radix-ui/react-scroll-area": "^1.2.8",
|
|
56
|
+
"@radix-ui/react-select": "^2.2.5",
|
|
57
|
+
"@radix-ui/react-separator": "^1.1.7",
|
|
58
|
+
"@radix-ui/react-slider": "^1.3.5",
|
|
59
|
+
"@radix-ui/react-slot": "^1.2.2",
|
|
60
|
+
"@radix-ui/react-switch": "^1.2.5",
|
|
61
|
+
"@radix-ui/react-tabs": "^1.1.12",
|
|
62
|
+
"@radix-ui/react-toast": "^1.2.2",
|
|
63
|
+
"@radix-ui/react-toggle": "^1.1.9",
|
|
64
|
+
"@radix-ui/react-toggle-group": "^1.1.10",
|
|
65
|
+
"@radix-ui/react-tooltip": "^1.2.6",
|
|
66
|
+
"@remotion/cli": "4.0.406",
|
|
67
|
+
"@remotion/media-utils": "4.0.406",
|
|
68
|
+
"@remotion/paths": "4.0.406",
|
|
69
|
+
"@remotion/player": "4.0.406",
|
|
70
|
+
"@remotion/renderer": "4.0.406",
|
|
71
|
+
"@remotion/shapes": "4.0.406",
|
|
72
|
+
"@remotion/three": "4.0.406",
|
|
73
|
+
"@remotion/transitions": "4.0.406",
|
|
74
|
+
"@stripe/stripe-js": "^4.10.0",
|
|
75
|
+
"@tanstack/react-query": "^5.81.5",
|
|
76
|
+
"@tanstack/react-query-devtools": "^5.81.5",
|
|
77
|
+
"@types/node": "^20",
|
|
78
|
+
"@types/pg": "^8.15.4",
|
|
79
|
+
"@types/react": "^19",
|
|
80
|
+
"@types/react-dom": "^19",
|
|
81
|
+
"@types/react-syntax-highlighter": "^15.5.13",
|
|
82
|
+
"@vercel/analytics": "^1.4.0",
|
|
83
|
+
"axios": "^1.10.0",
|
|
84
|
+
"class-variance-authority": "^0.7.1",
|
|
85
|
+
"clsx": "^2.1.1",
|
|
86
|
+
"cmdk": "^0.2.1",
|
|
87
|
+
"dotenv": "^17.0.0",
|
|
88
|
+
"form-data": "^4.0.3",
|
|
89
|
+
"framer-motion": "11",
|
|
90
|
+
"kysely": "^0.28.2",
|
|
91
|
+
"lodash": "^4.17.21",
|
|
92
|
+
"lucide-react": "^0.511.0",
|
|
93
|
+
"motion": "^12.12.1",
|
|
94
|
+
"nanoid": "^5.1.5",
|
|
95
|
+
"next": "15.3.2",
|
|
96
|
+
"next-themes": "^0.4.6",
|
|
97
|
+
"pg": "^8.16.3",
|
|
98
|
+
"react": "^18.0.0",
|
|
99
|
+
"react-dom": "^18.0.0",
|
|
100
|
+
"react-draggable": "^4.4.6",
|
|
101
|
+
"react-dropzone": "^14.3.8",
|
|
102
|
+
"react-markdown": "10",
|
|
103
|
+
"react-resizable-panels": "^3.0.2",
|
|
104
|
+
"react-syntax-highlighter": "^15.6.1",
|
|
105
|
+
"remark-gfm": "4",
|
|
106
|
+
"remeda": "2",
|
|
107
|
+
"remotion": "^4.0.406",
|
|
108
|
+
"shiki": "1",
|
|
109
|
+
"socket.io-client": "^4.8.1",
|
|
110
|
+
"sonner": "^2.0.3",
|
|
111
|
+
"swr": "^2.3.3",
|
|
112
|
+
"tailwind-merge": "^3.3.0",
|
|
113
|
+
"tinycolor2": "^1.6.0",
|
|
114
|
+
"vaul": "^1.1.2",
|
|
115
|
+
"zod": "^3.25.3",
|
|
116
|
+
"zustand": "^5.0.4"
|
|
117
|
+
},
|
|
118
|
+
"devDependencies": {
|
|
119
|
+
"@biomejs/biome": "1.9.4",
|
|
120
|
+
"@designcombo/types": "^5.4.2",
|
|
121
|
+
"@rollup/plugin-commonjs": "^25.0.8",
|
|
122
|
+
"@rollup/plugin-node-resolve": "^15.3.1",
|
|
123
|
+
"@rollup/plugin-typescript": "^11.1.6",
|
|
124
|
+
"@tailwindcss/postcss": "^4",
|
|
125
|
+
"@types/lodash": "^4.17.17",
|
|
126
|
+
"@types/tinycolor2": "^1.4.6",
|
|
127
|
+
"rollup": "^3.29.5",
|
|
128
|
+
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
129
|
+
"rollup-plugin-postcss": "^4.0.2",
|
|
130
|
+
"tailwindcss": "^4",
|
|
131
|
+
"tslib": "^2.8.1",
|
|
132
|
+
"tsx": "^4.20.3",
|
|
133
|
+
"tw-animate-css": "^1.3.0",
|
|
134
|
+
"typescript": "^5"
|
|
135
|
+
},
|
|
136
|
+
"packageManager": "pnpm@10.15.0+sha512.486ebc259d3e999a4e8691ce03b5cac4a71cbeca39372a9b762cb500cfdf0873e2cb16abe3d951b1ee2cf012503f027b98b6584e4df22524e0c7450d9ec7aa7b"
|
|
137
|
+
}
|