Skip to content

Commit 826abcc

Browse files
committed
merge from main
2 parents 13473b7 + 1bf8205 commit 826abcc

File tree

27 files changed

+118
-129
lines changed

27 files changed

+118
-129
lines changed

apps/studio/electron/preload/webview/dom.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ function processNode(node: HTMLElement): LayerNode {
114114
tagName: node.tagName.toLowerCase(),
115115
isVisible: style.visibility !== 'hidden',
116116
component: component || null,
117-
frameId: getWebviewId(),
117+
webviewId: getWebviewId(),
118118
children: null,
119119
parent: null,
120120
};

apps/studio/electron/preload/webview/elements/dom/remove.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export function getRemoveActionFromDomId(
2929
type: 'remove-element',
3030
targets: [
3131
{
32-
frameId: webviewId,
32+
webviewId,
3333
domId: actionEl.domId,
3434
oid: actionEl.oid,
3535
},

apps/studio/electron/preload/webview/elements/helpers.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export const getDomElement = (el: HTMLElement, getStyle: boolean): DomElement =>
3535
const parentDomElement: ParentDomElement | null = parent
3636
? {
3737
domId: parent.getAttribute(EditorAttributes.DATA_ONLOOK_DOM_ID) as string,
38-
frameId: getWebviewId(),
38+
webviewId: getWebviewId(),
3939
oid: parent.getAttribute(EditorAttributes.DATA_ONLOOK_ID) as string,
4040
instanceId: parent.getAttribute(EditorAttributes.DATA_ONLOOK_INSTANCE_ID) as string,
4141
rect: parent.getBoundingClientRect() as DOMRect,
@@ -47,7 +47,7 @@ export const getDomElement = (el: HTMLElement, getStyle: boolean): DomElement =>
4747
const domElement: DomElement = {
4848
domId: el.getAttribute(EditorAttributes.DATA_ONLOOK_DOM_ID) as string,
4949
oid: el.getAttribute(EditorAttributes.DATA_ONLOOK_ID) as string,
50-
frameId: getWebviewId(),
50+
webviewId: getWebviewId(),
5151
instanceId: el.getAttribute(EditorAttributes.DATA_ONLOOK_INSTANCE_ID) as string,
5252
rect,
5353
tagName: el.tagName,

apps/studio/src/lib/editor/engine/action/index.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ export class ActionManager {
8282

8383
updateStyle({ targets }: UpdateStyleAction) {
8484
targets.forEach((target) => {
85-
const webview = this.editorEngine.webviews.getWebview(target.frameId);
85+
const webview = this.editorEngine.webviews.getWebview(target.webviewId);
8686
if (!webview) {
8787
console.error('Failed to get webview');
8888
return;
@@ -112,7 +112,7 @@ export class ActionManager {
112112

113113
private insertElement({ targets, element, editText, location }: InsertElementAction) {
114114
targets.forEach((elementMetadata) => {
115-
const webview = this.editorEngine.webviews.getWebview(elementMetadata.frameId);
115+
const webview = this.editorEngine.webviews.getWebview(elementMetadata.webviewId);
116116
if (!webview) {
117117
console.error('Failed to get webview');
118118
return;
@@ -127,7 +127,7 @@ export class ActionManager {
127127

128128
private removeElement({ targets, location }: RemoveElementAction) {
129129
targets.forEach((target) => {
130-
const webview = this.editorEngine.webviews.getWebview(target.frameId);
130+
const webview = this.editorEngine.webviews.getWebview(target.webviewId);
131131
if (!webview) {
132132
console.error('Failed to get webview');
133133
return;
@@ -140,7 +140,7 @@ export class ActionManager {
140140

141141
private moveElement({ targets, location }: MoveElementAction) {
142142
targets.forEach((target) => {
143-
const webview = this.editorEngine.webviews.getWebview(target.frameId);
143+
const webview = this.editorEngine.webviews.getWebview(target.webviewId);
144144
if (!webview) {
145145
console.error('Failed to get webview');
146146
return;
@@ -154,7 +154,7 @@ export class ActionManager {
154154

155155
private editText({ targets, newContent }: EditTextAction) {
156156
targets.forEach((target) => {
157-
const webview = this.editorEngine.webviews.getWebview(target.frameId);
157+
const webview = this.editorEngine.webviews.getWebview(target.webviewId);
158158
if (!webview) {
159159
console.error('Failed to get webview');
160160
return;
@@ -167,7 +167,7 @@ export class ActionManager {
167167
}
168168

169169
private groupElements({ parent, container, children }: GroupElementsAction) {
170-
const webview = this.editorEngine.webviews.getWebview(parent.frameId);
170+
const webview = this.editorEngine.webviews.getWebview(parent.webviewId);
171171
if (!webview) {
172172
console.error('Failed to get webview');
173173
return;
@@ -176,7 +176,7 @@ export class ActionManager {
176176
}
177177

178178
private ungroupElements({ parent, container, children }: UngroupElementsAction) {
179-
const webview = this.editorEngine.webviews.getWebview(parent.frameId);
179+
const webview = this.editorEngine.webviews.getWebview(parent.webviewId);
180180
if (!webview) {
181181
console.error('Failed to get webview');
182182
return;
@@ -186,7 +186,7 @@ export class ActionManager {
186186

187187
private insertImage({ targets, image }: InsertImageAction) {
188188
targets.forEach((target) => {
189-
const webview = this.editorEngine.webviews.getWebview(target.frameId);
189+
const webview = this.editorEngine.webviews.getWebview(target.webviewId);
190190
if (!webview) {
191191
console.error('Failed to get webview');
192192
return;
@@ -200,7 +200,7 @@ export class ActionManager {
200200

201201
private removeImage({ targets }: RemoveImageAction) {
202202
targets.forEach((target) => {
203-
const webview = this.editorEngine.webviews.getWebview(target.frameId);
203+
const webview = this.editorEngine.webviews.getWebview(target.webviewId);
204204
if (!webview) {
205205
console.error('Failed to get webview');
206206
return;

apps/studio/src/lib/editor/engine/ast/layers.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export class LayersManager {
2727
return this.layers;
2828
}
2929
return this.layers.filter((layer) =>
30-
selectedWebviews.some((webview) => webview.id === layer.frameId),
30+
selectedWebviews.some((webview) => webview.id === layer.webviewId),
3131
);
3232
}
3333

apps/studio/src/lib/editor/engine/chat/context.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,7 @@ export class ChatContext {
122122
if (this.editorEngine.elements.selected.length === 0) {
123123
return null;
124124
}
125-
const webviewId = this.editorEngine.elements.selected[0].frameId;
125+
const webviewId = this.editorEngine.elements.selected[0].webviewId;
126126
if (!webviewId) {
127127
return null;
128128
}

apps/studio/src/lib/editor/engine/copy/index.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export class CopyManager {
2626
return;
2727
}
2828
const selectedEl = this.editorEngine.elements.selected[0];
29-
const webviewId = selectedEl.frameId;
29+
const webviewId = selectedEl.webviewId;
3030
const webview = this.editorEngine.webviews.getWebview(webviewId);
3131
if (!webview) {
3232
console.error('Failed to get webview');
@@ -73,7 +73,7 @@ export class CopyManager {
7373
const targets: Array<ActionTarget> = this.editorEngine.elements.selected.map(
7474
(selectedEl) => {
7575
const target: ActionTarget = {
76-
frameId: selectedEl.frameId,
76+
webviewId: selectedEl.webviewId,
7777
domId: selectedEl.domId,
7878
oid: selectedEl.oid,
7979
};
@@ -167,7 +167,7 @@ export class CopyManager {
167167
}
168168

169169
async getInsertLocation(selectedEl: DomElement): Promise<ActionLocation | undefined> {
170-
const webviewId = selectedEl.frameId;
170+
const webviewId = selectedEl.webviewId;
171171
const webview = this.editorEngine.webviews.getWebview(webviewId);
172172
if (!webview) {
173173
console.error('Failed to get webview');

apps/studio/src/lib/editor/engine/element/index.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ export class ElementManager {
3737

3838
const webviewEl: DomElement = {
3939
...domEl,
40-
frameId: webview.id,
40+
webviewId: webview.id,
4141
};
4242
const adjustedRect = adaptRectToCanvas(webviewEl.rect, webview);
4343
const isComponent = !!domEl.instanceId;
@@ -54,7 +54,7 @@ export class ElementManager {
5454
const selectedEl = this.selected[0];
5555
const hoverEl = this.hovered;
5656

57-
const webViewId = selectedEl.frameId;
57+
const webViewId = selectedEl.webviewId;
5858
const webview = this.editorEngine.webviews.getWebview(webViewId);
5959
if (!webview) {
6060
return;
@@ -137,7 +137,7 @@ export class ElementManager {
137137
}
138138

139139
for (const selectedEl of selected) {
140-
const webviewId = selectedEl.frameId;
140+
const webviewId = selectedEl.webviewId;
141141
const webview = this.editorEngine.webviews.getWebview(webviewId);
142142
if (!webview) {
143143
return;

apps/studio/src/lib/editor/engine/group/index.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -57,8 +57,8 @@ export class GroupManager {
5757
return null;
5858
}
5959

60-
const webviewId = elements[0].frameId;
61-
const sameWebview = elements.every((el) => el.frameId === webviewId);
60+
const webviewId = elements[0].webviewId;
61+
const sameWebview = elements.every((el) => el.webviewId === webviewId);
6262

6363
if (!sameWebview) {
6464
if (log) {
@@ -113,13 +113,13 @@ export class GroupManager {
113113
}
114114

115115
const parentTarget: ActionTarget = {
116-
frameId: webviewId,
116+
webviewId,
117117
domId: anyParent.domId,
118118
oid: anyParent.oid,
119119
};
120120

121121
const children: ActionTarget[] = selectedEls.map((el) => ({
122-
webviewId: el.frameId,
122+
webviewId: el.webviewId,
123123
domId: el.domId,
124124
oid: el.oid,
125125
}));
@@ -140,7 +140,7 @@ export class GroupManager {
140140
}
141141

142142
async getUngroupAction(selectedEl: DomElement): Promise<UngroupElementsAction | null> {
143-
const webview = this.editorEngine.webviews.getWebview(selectedEl.frameId);
143+
const webview = this.editorEngine.webviews.getWebview(selectedEl.webviewId);
144144
if (!webview) {
145145
console.error('Failed to get webview');
146146
return null;
@@ -171,7 +171,7 @@ export class GroupManager {
171171
// Children to be spread where container was
172172
const targets: ActionTarget[] = actionContainer.children.map((child) => {
173173
return {
174-
webviewId: selectedEl.frameId,
174+
webviewId: selectedEl.webviewId,
175175
domId: child.domId,
176176
oid: child.oid,
177177
};

apps/studio/src/lib/editor/engine/image/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -142,7 +142,7 @@ export class ImageManager {
142142
}
143143

144144
const targets: ActionTarget[] = selected.map((element) => ({
145-
webviewId: element.frameId,
145+
webviewId: element.webviewId,
146146
domId: element.domId,
147147
oid: element.oid,
148148
}));

apps/studio/src/lib/editor/engine/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ import { CodeManager } from './code';
2121
import { CopyManager } from './copy';
2222
import { ElementManager } from './element';
2323
import { ErrorManager } from './error';
24-
import { FilesManager } from './files';
2524
import { FontManager } from './font';
2625
import { GroupManager } from './group';
2726
import { HistoryManager } from './history';
@@ -30,6 +29,7 @@ import { InsertManager } from './insert';
3029
import { MoveManager } from './move';
3130
import { OverlayManager } from './overlay';
3231
import { PagesManager } from './pages';
32+
import { FilesManager } from './files';
3333
import { ProjectInfoManager } from './projectinfo';
3434
import { StyleManager } from './style';
3535
import { TextEditingManager } from './text';
@@ -273,7 +273,7 @@ export class EditorEngine {
273273
return;
274274
}
275275
const selectedEl = selected[0];
276-
const webviewId = selectedEl.frameId;
276+
const webviewId = selectedEl.webviewId;
277277
const webview = this.webviews.getWebview(webviewId);
278278
if (!webview) {
279279
return;

apps/studio/src/lib/editor/engine/insert/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -196,7 +196,7 @@ export class InsertManager {
196196

197197
const targets: Array<ActionTarget> = [
198198
{
199-
frameId: webview.id,
199+
webviewId: webview.id,
200200
domId,
201201
oid: null,
202202
},
@@ -271,7 +271,7 @@ export class InsertManager {
271271

272272
const action: InsertElementAction = {
273273
type: 'insert-element',
274-
targets: [{ frameId: webview.id, domId, oid }],
274+
targets: [{ webviewId: webview.id, domId, oid }],
275275
element: imageElement,
276276
location,
277277
editText: false,
@@ -311,7 +311,7 @@ export class InsertManager {
311311

312312
domId: targetElement.domId,
313313
oid: targetElement.oid,
314-
frameId: webview.id,
314+
webviewId: webview.id,
315315
},
316316
],
317317
};
@@ -352,7 +352,7 @@ export class InsertManager {
352352
type: 'insert-element',
353353
targets: [
354354
{
355-
frameId: webview.id,
355+
webviewId: webview.id,
356356
domId,
357357
oid: null,
358358
},

apps/studio/src/lib/editor/engine/move/index.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export class MoveManager {
5353
return;
5454
}
5555

56-
const webview = this.editorEngine.webviews.getWebview(this.dragTarget.frameId);
56+
const webview = this.editorEngine.webviews.getWebview(this.dragTarget.webviewId);
5757
if (!webview) {
5858
console.error('No webview found for drag');
5959
return;
@@ -87,7 +87,7 @@ export class MoveManager {
8787
y: dragOrigin.y - dragTarget.rect.y,
8888
};
8989

90-
const webview = this.editorEngine.webviews.getWebview(dragTarget.frameId);
90+
const webview = this.editorEngine.webviews.getWebview(dragTarget.webviewId);
9191
if (!webview) {
9292
console.error('No webview found for drag');
9393
return;
@@ -125,7 +125,7 @@ export class MoveManager {
125125
return;
126126
}
127127

128-
const webview = this.editorEngine.webviews.getWebview(this.dragTarget.frameId);
128+
const webview = this.editorEngine.webviews.getWebview(this.dragTarget.webviewId);
129129
if (!webview) {
130130
console.error('No webview found for drag end');
131131
this.endAllDrag();
@@ -176,7 +176,7 @@ export class MoveManager {
176176
}
177177

178178
async shiftElement(element: DomElement, direction: 'up' | 'down'): Promise<void> {
179-
const webview = this.editorEngine.webviews.getWebview(element.frameId);
179+
const webview = this.editorEngine.webviews.getWebview(element.webviewId);
180180
if (!webview) {
181181
return;
182182
}
@@ -242,7 +242,7 @@ export class MoveManager {
242242
},
243243
targets: [
244244
{
245-
frameId: webviewId,
245+
webviewId,
246246
domId: child.domId,
247247
oid: child.instanceId || child.oid,
248248
},

apps/studio/src/lib/editor/engine/overlay/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export class OverlayManager {
2929
this.state.updateHoverRect(null);
3030
const newClickRects: { rect: RectDimensions; styles: Record<string, string> }[] = [];
3131
for (const selectedElement of this.editorEngine.elements.selected) {
32-
const webview = this.editorEngine.webviews.getWebview(selectedElement.frameId);
32+
const webview = this.editorEngine.webviews.getWebview(selectedElement.webviewId);
3333
if (!webview) {
3434
continue;
3535
}

apps/studio/src/lib/editor/engine/style/index.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,12 @@ import {
33
type StyleActionTarget,
44
type UpdateStyleAction,
55
} from '@onlook/models/actions';
6-
import type { Font } from '@onlook/models/assets';
76
import type { DomElement } from '@onlook/models/element';
87
import { StyleChangeType, type StyleChange } from '@onlook/models/style';
9-
import { convertFontString } from '@onlook/utility';
108
import { makeAutoObservable, reaction } from 'mobx';
119
import type { EditorEngine } from '..';
10+
import type { Font } from '@onlook/models/assets';
11+
import { convertFontString } from '@onlook/utility';
1212

1313
export interface SelectedStyle {
1414
styles: Record<string, string>;
@@ -129,7 +129,7 @@ export class StyleManager {
129129
),
130130
};
131131
const target: StyleActionTarget = {
132-
frameId: selectedEl.frameId,
132+
webviewId: selectedEl.webviewId,
133133
domId: selectedEl.domId,
134134
oid: this.mode === StyleMode.Instance ? selectedEl.instanceId : selectedEl.oid,
135135
change: change,

0 commit comments

Comments
 (0)