@aicut/core 0.4.0 → 0.4.2

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aicut/core",
3
- "version": "0.4.0",
3
+ "version": "0.4.2",
4
4
  "description": "Framework-agnostic core for the AiCut video editor — canvas timeline, data model, HTML5 playback engine, plus an opt-in 3D lighting picker.",
5
5
  "license": "MIT",
6
6
  "author": "ziqiang <ziqiangytu@gmail.com>",
package/styles/theme.css CHANGED
@@ -52,7 +52,11 @@
52
52
  --aicut-playhead-color: var(--color-brand);
53
53
 
54
54
  display: grid;
55
- grid-template-rows: 1fr auto auto;
55
+ /* header (auto, hidden when empty) · preview (1fr) · toolbar (auto)
56
+ · timeline (auto). When the header is empty the :has() rule below
57
+ overrides the template to drop the row so today's layout stays
58
+ identical for callers who don't use the header slots. */
59
+ grid-template-rows: auto 1fr auto auto;
56
60
  width: 100%;
57
61
  height: 100%;
58
62
  min-height: 480px;
@@ -130,6 +134,54 @@
130
134
  display: inline-flex;
131
135
  }
132
136
 
137
+ /* ===== Header (opt-in via slots) ===== */
138
+
139
+ /* Slim bar above the preview. Bookend left/right slots are host-
140
+ filled via the React wrapper's headerLeft/headerRight props or the
141
+ Vue named slots. Collapsed entirely when both slots are empty so
142
+ the default editor layout is byte-for-byte the same as before the
143
+ header existed. */
144
+ .aicut-header {
145
+ display: flex;
146
+ align-items: center;
147
+ justify-content: space-between;
148
+ gap: 12px;
149
+ height: 44px;
150
+ padding: 0 12px;
151
+ background: var(--aicut-controls-bg);
152
+ border-bottom: 1px solid var(--aicut-controls-border);
153
+ color: var(--aicut-controls-text);
154
+ font-size: 13px;
155
+ /* Sit above the preview so dropdowns/popovers from header buttons
156
+ can overflow naturally without z-index plumbing. */
157
+ position: relative;
158
+ z-index: 1;
159
+ }
160
+
161
+ /* Auto-hide when both slots are empty — keep today's default layout
162
+ exactly as it was for callers that don't use the header. */
163
+ .aicut-root:has(.aicut-header-left:empty):has(.aicut-header-right:empty)
164
+ .aicut-header {
165
+ display: none;
166
+ }
167
+ /* Fallback for browsers without :has() — collapse the grid row when
168
+ the header is hidden via the above rule. Modern Chrome/Safari/
169
+ Firefox all support :has() so this is rarely needed. */
170
+ .aicut-root:not(:has(.aicut-header *)) {
171
+ grid-template-rows: 1fr auto auto;
172
+ }
173
+
174
+ .aicut-header-slot {
175
+ display: flex;
176
+ align-items: center;
177
+ gap: 8px;
178
+ min-width: 0;
179
+ }
180
+
181
+ .aicut-header-right {
182
+ margin-left: auto;
183
+ }
184
+
133
185
  /* ===== Toolbar ===== */
134
186
 
135
187
  .aicut-toolbar {