@aicut/react 0.4.2 → 0.4.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.
Files changed (2) hide show
  1. package/README.md +20 -2
  2. package/package.json +2 -2
package/README.md CHANGED
@@ -69,6 +69,9 @@ interface VideoEditorProps {
69
69
  theme?: Theme; // CSS-var overrides; reactive
70
70
  locale?: Partial<Locale>; // EN default; pass localeZh for ZH
71
71
 
72
+ headerLeft?: ReactNode; // optional header row above
73
+ headerRight?: ReactNode; // the preview — collapses
74
+ // when both are empty
72
75
  toolbarLeft?: ReactNode; // host controls — left bookend
73
76
  toolbarRight?: ReactNode; // right bookend
74
77
 
@@ -90,9 +93,24 @@ interface VideoEditorProps {
90
93
 
91
94
  The `apiRef` value exposes the full **`EditorApi`** — `play`, `pause`, `seek`, `split`, `trimLeft`, `trimRight`, `setProject`, `getProject`, `addSource`, `addTrack`, `removeClip`, `undo`, `redo`, `setTheme`, `setLocale`, `requestExport`, and more. See [@aicut/core](https://www.npmjs.com/package/@aicut/core) for the complete surface.
92
95
 
93
- ## Custom toolbar controls
96
+ ## Custom slots (header + toolbar)
94
97
 
95
- The editor's top toolbar reserves bookend slots for any React node. The library hides the visual separator until you put something in them.
98
+ The editor reserves **four** host-fillable slots all empty by default with no chrome cost. The optional header above the preview auto-collapses when both header slots are empty, so the default layout is byte-for-byte identical to before they existed.
99
+
100
+ ```tsx
101
+ <VideoEditor
102
+ // Header row above the preview — invisible when both null
103
+ headerLeft={<strong>Untitled project</strong>}
104
+ headerRight={
105
+ <>
106
+ <button onClick={share}>Share</button>
107
+ <button onClick={() => apiRef.current?.requestExport()}>Export</button>
108
+ </>
109
+ }
110
+ />
111
+ ```
112
+
113
+ ### Toolbar bookends
96
114
 
97
115
  ```tsx
98
116
  <VideoEditor
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aicut/react",
3
- "version": "0.4.2",
3
+ "version": "0.4.3",
4
4
  "description": "React wrapper for the AiCut video editor + lighting picker — thin declarative shells over @aicut/core.",
5
5
  "license": "MIT",
6
6
  "author": "ziqiang <ziqiangytu@gmail.com>",
@@ -59,7 +59,7 @@
59
59
  "README.md"
60
60
  ],
61
61
  "dependencies": {
62
- "@aicut/core": "0.4.2"
62
+ "@aicut/core": "0.4.3"
63
63
  },
64
64
  "peerDependencies": {
65
65
  "react": "^18.0.0 || ^19.0.0",