@fastlabai/design-editor 1.0.0-beta.1 → 1.0.0-beta.3
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 +8 -2
- package/dist/index.cjs +376 -325
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +6 -4
- package/dist/index.d.ts +6 -4
- package/dist/index.js +376 -325
- package/dist/index.js.map +1 -1
- package/dist/theme.css +718 -10
- package/package.json +15 -2
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
[](LICENSE)
|
|
5
5
|
[](https://github.com/fastlabai/design-editor/actions/workflows/ci.yml)
|
|
6
6
|
|
|
7
|
-
An open-source image design editor for React and Next.js. Plug in your own
|
|
7
|
+
An open-source image design editor for React and Next.js, brought to you by [FastlabAI](https://fastlab.ai). Plug in your own
|
|
8
8
|
media library, fonts, and storage backend via simple provider interfaces.
|
|
9
9
|
|
|
10
10
|
|
|
@@ -15,6 +15,8 @@ media library, fonts, and storage backend via simple provider interfaces.
|
|
|
15
15
|
- Background removal (via optional `@imgly/background-removal` peer dep)
|
|
16
16
|
- Undo / redo, zoom / pan, autosave
|
|
17
17
|
- Themable via CSS variables — bring your own colors
|
|
18
|
+
- Zero-conflict CSS — styles are securely scoped to `[data-de-root]`, guaranteeing no interference with your host app's Bootstrap or Tailwind classes.
|
|
19
|
+
- Fully flexible UI — optional `onBack` prop (hides the back button automatically if omitted).
|
|
18
20
|
- TypeScript-first, strict types
|
|
19
21
|
- Next.js App Router compatible (components ship with `'use client'`)
|
|
20
22
|
- ~150 KB gzipped (excluding React and Fabric.js)
|
|
@@ -42,10 +44,14 @@ export default function App() {
|
|
|
42
44
|
|
|
43
45
|
```tsx
|
|
44
46
|
<DesignEditor
|
|
47
|
+
title="My Custom Studio Title"
|
|
45
48
|
mediaProvider={myMediaProvider}
|
|
46
49
|
fontProvider={myFontProvider}
|
|
47
50
|
persistenceProvider={myPersistenceProvider}
|
|
48
|
-
onExport={async (blob) =>
|
|
51
|
+
onExport={async (blob, format, scene) => {
|
|
52
|
+
const url = await uploadToS3(blob)
|
|
53
|
+
await saveToDatabase(scene) // Save raw JSON to re-edit later
|
|
54
|
+
}}
|
|
49
55
|
onBack={() => router.push('/dashboard')}
|
|
50
56
|
/>
|
|
51
57
|
```
|