@lvce-editor/renderer-process 30.36.2 → 30.38.0

package/dist/editorOnlyRendererProcessMain.js

@@ -1198,6 +1198,61 @@ const createIdGenerator = () => {
 };
 const create$1 = createIdGenerator();
 
+const state$3 = Object.create(null);
+const retainString = (item, index) => {
+  const value = new Promise(resolve => {
+    item.getAsString(resolve);
+  });
+  return {
+    index,
+    kind: 'string',
+    type: item.type,
+    value
+  };
+};
+const retainFileSystemHandle = async item => {
+  // getAsFileSystemHandle must be invoked while the drag data store is readable.
+  const {
+    getAsFileSystemHandle
+  } = item;
+  if (typeof getAsFileSystemHandle !== 'function') {
+    return undefined;
+  }
+  try {
+    return await getAsFileSystemHandle.call(item);
+  } catch {
+    return undefined;
+  }
+};
+const retainFile = (item, index) => {
+  return {
+    file: item.getAsFile(),
+    fileSystemHandle: retainFileSystemHandle(item),
+    index,
+    kind: 'file',
+    type: item.type
+  };
+};
+const retainItems = dataTransfer => {
+  if (!dataTransfer) {
+    return [];
+  }
+  const items = [];
+  for (const [index, item] of [...dataTransfer.items].entries()) {
+    if (item.kind === 'string') {
+      items.push(retainString(item, index));
+    } else if (item.kind === 'file') {
+      items.push(retainFile(item, index));
+    }
+  }
+  return items;
+};
+const add$2 = dataTransfer => {
+  const id = create$1();
+  state$3[id] = retainItems(dataTransfer);
+  return id;
+};
+
 const state$2 = Object.create(null);
 const add$1 = promise => {
   const id = create$1();
@@ -1344,6 +1399,11 @@ const getEventListenerArg = (param, event) => {
       return event.deltaY;
     case 'event.detail':
       return event.detail;
+    case 'event.dropId':
+      if (event.type !== 'drop') {
+        throw new Error('event.dropId is only available for drop events');
+      }
+      return add$2(event.dataTransfer || null);
     case 'event.inputType':
       return event.inputType;
     case 'event.isTrusted':

package/dist/rendererProcessMain.js

@@ -118,29 +118,29 @@ const confirm = message => {
   return window.confirm(message);
 };
 
-const state$d = {
+const state$e = {
   styleSheets: Object.create(null),
   texts: Object.create(null)
 };
 const set$b = (id, sheet) => {
-  state$d.styleSheets[id] = sheet;
+  state$e.styleSheets[id] = sheet;
 };
-const get$a = id => {
-  return state$d.styleSheets[id];
+const get$b = id => {
+  return state$e.styleSheets[id];
 };
 const setText$2 = (id, text) => {
-  state$d.texts[id] = text;
+  state$e.texts[id] = text;
 };
 const getText = id => {
-  return state$d.texts[id];
+  return state$e.texts[id];
 };
 const remove$5 = id => {
-  delete state$d.styleSheets[id];
-  delete state$d.texts[id];
+  delete state$e.styleSheets[id];
+  delete state$e.texts[id];
 };
 
 const addCssStyleSheet = (id, text) => {
-  const existing = get$a(id);
+  const existing = get$b(id);
   if (existing) {
     existing.replaceSync(text);
     setText$2(id, text);
@@ -153,7 +153,7 @@ const addCssStyleSheet = (id, text) => {
   document.adoptedStyleSheets.push(sheet);
 };
 const patchCssStyleSheet = (id, start, deleteCount, replacement) => {
-  const sheet = get$a(id);
+  const sheet = get$b(id);
   const text = getText(id);
   if (!sheet || typeof text !== 'string') {
     throw new Error(`stylesheet ${id} must be initialized before it can be patched`);
@@ -172,7 +172,7 @@ const patchCssStyleSheet = (id, start, deleteCount, replacement) => {
   setText$2(id, newText);
 };
 const removeCssStyleSheet = id => {
-  const sheet = get$a(id);
+  const sheet = get$b(id);
   if (!sheet) {
     return;
   }
@@ -331,6 +331,69 @@ const createIdGenerator = () => {
 };
 const create$J = createIdGenerator();
 
+const state$d = Object.create(null);
+const retainString = (item, index) => {
+  const value = new Promise(resolve => {
+    item.getAsString(resolve);
+  });
+  return {
+    index,
+    kind: 'string',
+    type: item.type,
+    value
+  };
+};
+const retainFileSystemHandle = async item => {
+  // getAsFileSystemHandle must be invoked while the drag data store is readable.
+  const {
+    getAsFileSystemHandle
+  } = item;
+  if (typeof getAsFileSystemHandle !== 'function') {
+    return undefined;
+  }
+  try {
+    return await getAsFileSystemHandle.call(item);
+  } catch {
+    return undefined;
+  }
+};
+const retainFile = (item, index) => {
+  return {
+    file: item.getAsFile(),
+    fileSystemHandle: retainFileSystemHandle(item),
+    index,
+    kind: 'file',
+    type: item.type
+  };
+};
+const retainItems = dataTransfer => {
+  if (!dataTransfer) {
+    return [];
+  }
+  const items = [];
+  for (const [index, item] of [...dataTransfer.items].entries()) {
+    if (item.kind === 'string') {
+      items.push(retainString(item, index));
+    } else if (item.kind === 'file') {
+      items.push(retainFile(item, index));
+    }
+  }
+  return items;
+};
+const add$2 = dataTransfer => {
+  const id = create$J();
+  state$d[id] = retainItems(dataTransfer);
+  return id;
+};
+const acquire$2 = id => {
+  const items = state$d[id];
+  if (!items) {
+    throw new Error(`Drop data not found: ${id}`);
+  }
+  delete state$d[id];
+  return items;
+};
+
 const state$c = Object.create(null);
 const acquire$1 = id => {
   const promise = state$c[id];
@@ -491,6 +554,11 @@ const getEventListenerArg = (param, event) => {
       return event.deltaY;
     case 'event.detail':
       return event.detail;
+    case 'event.dropId':
+      if (event.type !== 'drop') {
+        throw new Error('event.dropId is only available for drop events');
+      }
+      return add$2(event.dataTransfer || null);
     case 'event.inputType':
       return event.inputType;
     case 'event.isTrusted':
@@ -1271,7 +1339,7 @@ const {
 } = ElementTagMap;
 
 const instances = Object.create(null);
-const get$9 = viewletId => {
+const get$a = viewletId => {
   return instances[viewletId];
 };
 const set$a = (viewletId, instance) => {
@@ -1306,7 +1374,7 @@ const has$1 = listener => {
 const set$9 = (listener, value) => {
   cache.set(listener, value);
 };
-const get$8 = listener => {
+const get$9 = listener => {
   return cache.get(listener);
 };
 
@@ -1328,7 +1396,7 @@ const getWrappedListener = (listener, returnValue) => {
     nameAnonymousFunction$1(wrapped, listener.name);
     set$9(listener, wrapped);
   }
-  return get$8(listener);
+  return get$9(listener);
 };
 
 const attachedListeners = new WeakMap();
@@ -1562,7 +1630,7 @@ const renderDomElement = (element, eventMap, newEventMap) => {
   return $Element;
 };
 const renderReferenceNode = (element, eventMap, newEventMap) => {
-  const instance = get$9(element.uid);
+  const instance = get$a(element.uid);
   if (!instance || !instance.state) {
     return document.createTextNode('Reference node not found');
   }
@@ -1708,7 +1776,7 @@ const handleNavigateSibling = (state, patch, $Element, patchIndex) => {
   return true;
 };
 const handleSetReferenceNodeUid = (state, patch) => {
-  const instance = get$9(patch.uid);
+  const instance = get$a(patch.uid);
   if (!instance || !instance.state) {
     console.error('Cannot set reference node uid: instance not found', {
       uid: patch.uid
@@ -1925,12 +1993,12 @@ const rememberFocus$1 = ($Viewlet, dom, eventMap, uid = 0) => {
 };
 
 const set$8 = setComponentUid;
-const get$7 = getComponentUid;
+const get$8 = getComponentUid;
 const fromEvent = getComponentUidFromEvent;
 
 const rpcs = new Map();
 const viewRpcIds = new Map();
-const get$6 = uid => {
+const get$7 = uid => {
   const rpcId = viewRpcIds.get(uid);
   return rpcId === undefined ? undefined : rpcs.get(rpcId);
 };
@@ -1947,7 +2015,7 @@ const getViewUid = rpcId => {
   return matchingUid;
 };
 const getFocusedViewUid = (rpcId, element = document.activeElement) => {
-  const uid = element ? get$7(element) : 0;
+  const uid = element ? get$8(element) : 0;
   if (!uid || viewRpcIds.get(uid) !== rpcId) {
     throw new Error(`focused direct view not found: ${rpcId}`);
   }
@@ -1993,6 +2061,69 @@ const getFilePathElectron = async file => {
   return filePath;
 };
 
+const validFormats = new Set(['file', 'fileSystemHandle', 'string']);
+const validateOptions = options => {
+  if (!options || !Array.isArray(options.formats) || typeof options.includeElectronFilePaths !== 'boolean') {
+    throw new TypeError('Invalid drop data options');
+  }
+  for (const format of options.formats) {
+    if (!validFormats.has(format)) {
+      throw new TypeError(`Invalid drop data format: ${format}`);
+    }
+  }
+};
+const resolveString = async item => {
+  return {
+    index: item.index,
+    kind: 'string',
+    type: item.type,
+    value: await item.value
+  };
+};
+const resolveFile = async (item, formats, includeElectronFilePaths) => {
+  const includeFile = formats.has('file');
+  const includeFileSystemHandle = formats.has('fileSystemHandle');
+  const fileSystemHandle = includeFileSystemHandle ? await item.fileSystemHandle : undefined;
+  const electronFilePath = includeElectronFilePaths && globalThis.electronGlobals && item.file ? await getFilePathElectron(item.file) : undefined;
+  if ((!includeFile || !item.file) && !fileSystemHandle && electronFilePath === undefined) {
+    return undefined;
+  }
+  return {
+    ...(electronFilePath !== undefined && {
+      electronFilePath
+    }),
+    ...(includeFile && item.file && {
+      file: item.file
+    }),
+    ...(fileSystemHandle && {
+      fileSystemHandle
+    }),
+    index: item.index,
+    kind: 'file',
+    name: fileSystemHandle?.name || item.file?.name || '',
+    type: item.type
+  };
+};
+const get$6 = async (dropId, options) => {
+  validateOptions(options);
+  const retainedItems = acquire$2(dropId);
+  const formats = new Set(options.formats);
+  const items = [];
+  for (const retainedItem of retainedItems) {
+    if (retainedItem.kind === 'string') {
+      if (formats.has('string')) {
+        items.push(await resolveString(retainedItem));
+      }
+      continue;
+    }
+    const item = await resolveFile(retainedItem, formats, options.includeElectronFilePaths);
+    if (item) {
+      items.push(item);
+    }
+  }
+  return items;
+};
+
 const isFileSystemFileHandle = value => {
   if (!value || typeof value !== 'object') {
     return false;
@@ -4493,7 +4624,7 @@ const showControlled = ({
   showMenu(x, y, width, height, items, level);
   const $Menu = state$5.$$Menus.at(-1);
   if ($Parent && $Menu) {
-    const uid = get$7($Parent);
+    const uid = get$8($Parent);
     set$8($Menu, uid);
   }
   // TODO menu should not necessarily know about parent (titleBarMenuBar)
@@ -5416,6 +5547,62 @@ const take = (uid, transactionId) => {
 
 const rememberFocus = rememberFocus$1;
 
+const getColor = ($Parent, className) => {
+  const $Probe = document.createElement('span');
+  $Probe.className = className;
+  $Probe.hidden = true;
+  $Parent.append($Probe);
+  const color = getComputedStyle($Probe).color;
+  $Probe.remove();
+  return color;
+};
+const getColors = ($Parent, rectangles) => {
+  const colors = new Map();
+  for (const rectangle of rectangles) {
+    if (!colors.has(rectangle.className)) {
+      colors.set(rectangle.className, getColor($Parent, rectangle.className));
+    }
+  }
+  return colors;
+};
+const getOrCreateCanvas = ($Parent, className) => {
+  const existing = $Parent.querySelector(`:scope > canvas.${className}`);
+  if (existing) {
+    return existing;
+  }
+  const $Canvas = document.createElement('canvas');
+  $Canvas.className = className;
+  $Canvas.ariaHidden = 'true';
+  $Parent.append($Canvas);
+  return $Canvas;
+};
+const renderCanvas$1 = ($Viewlet, selector, canvasClassName, width, height, rectangles, revision) => {
+  const $Parent = $Viewlet.matches(selector) ? $Viewlet : $Viewlet.querySelector(selector);
+  if (!$Parent) {
+    return;
+  }
+  const $Canvas = getOrCreateCanvas($Parent, canvasClassName);
+  const devicePixelRatio = globalThis.devicePixelRatio || 1;
+  $Canvas.width = Math.round(width * devicePixelRatio);
+  $Canvas.height = Math.round(height * devicePixelRatio);
+  $Canvas.style.width = `${width}px`;
+  $Canvas.style.height = `${height}px`;
+  $Canvas.dataset.renderRevision = revision;
+  $Canvas.dataset.rectangleCount = String(rectangles.length);
+  const context = $Canvas.getContext('2d');
+  if (!context) {
+    return;
+  }
+  context.resetTransform();
+  context.clearRect(0, 0, $Canvas.width, $Canvas.height);
+  context.scale(devicePixelRatio, devicePixelRatio);
+  const colors = getColors($Parent, rectangles);
+  for (const rectangle of rectangles) {
+    context.fillStyle = colors.get(rectangle.className) || 'currentColor';
+    context.fillRect(rectangle.x, rectangle.y, rectangle.width, rectangle.height);
+  }
+};
+
 const handleImageLoad = event => {
   const $ImagePreviewImage = event.target;
   const $ImagePreviewCaption = $ImagePreviewImage.nextSibling;
@@ -5552,7 +5739,7 @@ const ViewletActivityBar = {
 const executeViewletCommand$1 = 'Viewlet.executeViewletCommand';
 const send = (method, uid, ...args) => {
   if (method === executeViewletCommand$1) {
-    const rpc = get$6(uid);
+    const rpc = get$7(uid);
     if (rpc) {
       rpc.send(method, uid, ...args);
       return;
@@ -5747,7 +5934,7 @@ const applyUidWorkaround = element => {
   if (!editor) {
     throw new Error('no editor found');
   }
-  const editorUid = get$7(editor);
+  const editorUid = get$8(editor);
   set$8(element, editorUid);
 };
 
@@ -7721,7 +7908,7 @@ const handleClickAction$1 = target => {
     console.info('[panel] action command not found');
     return;
   }
-  const childUid = get$7(target);
+  const childUid = get$8(target);
   handleClickAction$2(childUid, index, command);
 };
 const handleHeaderClick$1 = event => {
@@ -7847,7 +8034,7 @@ const setActionsDom$1 = (state, actions, childUid) => {
   const {
     $PanelActions
   } = state;
-  const instance = get$9(childUid);
+  const instance = get$a(childUid);
   if (!instance) {
     throw new Error(`child instance not found`);
   }
@@ -8279,7 +8466,7 @@ const handleMouseDown$1 = event => {
   if (!terminal) {
     return;
   }
-  const terminalUid = get$7(terminal);
+  const terminalUid = get$8(terminal);
   if (!terminalUid) {
     return;
   }
@@ -8928,7 +9115,7 @@ const create$2 = (id, uid = id) => {
   if (!module) {
     throw new Error(`module not found: ${id}`);
   }
-  const existing = get$9(id);
+  const existing = get$a(id);
   if (existing?.state.$Viewlet.isConnected) {
     existing.state.$Viewlet.remove();
   }
@@ -8950,7 +9137,7 @@ const createFunctionalRoot = (id, uid = id, hasFunctionalEvents, directEventRpcI
   if (!module) {
     throw new Error(`module not found: ${id}`);
   }
-  const existing = get$9(id);
+  const existing = get$a(id);
   if (existing?.state.$Viewlet.isConnected) {
     existing.state.$Viewlet.remove();
   }
@@ -8982,7 +9169,7 @@ const loadModule = async id => {
 };
 const invoke = (viewletId, method, ...args) => {
   string(method);
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance?.factory) {
     if (viewletId && method !== 'setActionsDom') {
       warn$1(`cannot execute ${method} viewlet instance ${viewletId} not found`);
@@ -9000,7 +9187,7 @@ const focus$1 = viewletId => {
     // eslint-disable-next-line no-console
     console.trace(`focus ${viewletId}`);
   }
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (instance.factory?.setFocused) {
     instance.factory.setFocused(instance.state, true);
   } else if (instance?.factory?.focus) {
@@ -9016,7 +9203,7 @@ const focusElementByName = (viewletId, name) => {
     // eslint-disable-next-line no-console
     console.trace(`focusByName ${viewletId} ${name}`);
   }
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance) {
     return;
   }
@@ -9031,7 +9218,7 @@ const focusElementByName = (viewletId, name) => {
 };
 const setElementProperty = (viewletId, name, key, value) => {
   const selector = `[name="${name}"]`;
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance) {
     return;
   }
@@ -9060,7 +9247,7 @@ const setCheckboxValue = (viewletId, name, value) => {
 };
 const setSelectionByName = (viewletId, name, start, end) => {
   const selector = `[name="${name}"]`;
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance) {
     return;
   }
@@ -9075,7 +9262,7 @@ const setSelectionByName = (viewletId, name, start, end) => {
   $Element.selectionEnd = end;
 };
 const setUid = (viewletId, uid) => {
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance) {
     return;
   }
@@ -9093,7 +9280,7 @@ const resetFocusCallback = () => {
   focusCallback.selector = '';
 };
 const focusSelector = (viewletId, selector) => {
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance) {
     return;
   }
@@ -9125,7 +9312,7 @@ const focusSelectorAfterRender = (viewletId, selector) => {
  * @deprecated
  */
 const refresh = (viewletId, viewletContext) => {
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (instance) {
     instance.factory.refresh(instance.state, viewletContext);
   } else {
@@ -9144,7 +9331,7 @@ const createPlaceholder = (viewletId, parentId, top, left, width, height) => {
   if (isSpecial(viewletId)) {
     $Placeholder.id = viewletId;
   }
-  const parentInstance = get$9(parentId);
+  const parentInstance = get$a(parentId);
   const $Parent = parentInstance.state.$Viewlet;
   $Parent.append($Placeholder);
   set$a(viewletId, {
@@ -9160,7 +9347,7 @@ const getDragData = () => {
   return getCurrent();
 };
 const setDom = (viewletId, dom) => {
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance) {
     return;
   }
@@ -9173,7 +9360,7 @@ const setDom = (viewletId, dom) => {
   renderInto($Viewlet, dom, Events);
 };
 const setDom2 = (viewletId, dom) => {
-  const instance = get$9(viewletId);
+  const instance = get$a(viewletId);
   if (!instance) {
     return;
   }
@@ -9186,7 +9373,7 @@ const setDom2 = (viewletId, dom) => {
   let uid;
   if ($Viewlet) {
     try {
-      uid = get$7($Viewlet);
+      uid = get$8($Viewlet);
     } catch {}
   }
   // TODO optimize rendering with virtual DOM diffing
@@ -9204,7 +9391,7 @@ const setDom2 = (viewletId, dom) => {
   });
 };
 const setPatches = (uid, patches) => {
-  const instance = get$9(uid);
+  const instance = get$a(uid);
   if (!instance) {
     return;
   }
@@ -9276,7 +9463,7 @@ const dispose$3 = id => {
   try {
     number(id);
     unregisterView(id);
-    const instance = get$9(id);
+    const instance = get$a(id);
     if (!instance) {
       warn$1(`viewlet instance ${id} not found and cannot be disposed`);
       return;
@@ -9295,7 +9482,7 @@ const dispose$3 = id => {
 };
 const handleError$1 = (id, parentId, message) => {
   info(`[viewlet-error] ${id}: ${message}`);
-  const instance = get$9(id);
+  const instance = get$a(id);
   if (instance?.state.$Viewlet.isConnected) {
     instance.state.$Viewlet.remove();
   }
@@ -9307,7 +9494,7 @@ const handleError$1 = (id, parentId, message) => {
     instance.state.$Viewlet.textContent = String(message);
   }
   // TODO error should bubble up to until highest possible component
-  const parentInstance = get$9(parentId);
+  const parentInstance = get$a(parentId);
   if (parentInstance?.factory?.handleError) {
     parentInstance.factory.handleError(instance.state, message);
   }
@@ -9321,9 +9508,9 @@ const appendViewlet = (parentId, childId, focus) => {
     // TODO
     return;
   }
-  const parentInstanceState = get$9(parentId); // TODO must ensure that parent is already created
+  const parentInstanceState = get$a(parentId); // TODO must ensure that parent is already created
   const parentModule = parentInstanceState.factory;
-  const childInstance = get$9(childId);
+  const childInstance = get$a(childId);
   if (!childInstance) {
     throw new Error(`child instance ${childId} must be defined to be appended to parent ${parentId}`);
   }
@@ -9347,7 +9534,7 @@ const prependChild = ($Parent, $Child) => {
 const appendAfterPreviousReference = (referenceNodes, childIndex, $Child) => {
   for (let i = childIndex - 1; i >= 0; i--) {
     const beforeId = referenceNodes[i];
-    const beforeInstance = get$9(beforeId);
+    const beforeInstance = get$a(beforeId);
     if (beforeInstance) {
       const $ReferenceNode = beforeInstance.state.$Viewlet;
       $ReferenceNode.after($Child);
@@ -9359,7 +9546,7 @@ const appendAfterPreviousReference = (referenceNodes, childIndex, $Child) => {
 const appendBeforeNextReference = (referenceNodes, childIndex, $Child) => {
   for (let i = childIndex + 1; i < referenceNodes.length; i++) {
     const afterId = referenceNodes[i];
-    const afterInstance = get$9(afterId);
+    const afterInstance = get$a(afterId);
     if (afterInstance) {
       const $ReferenceNode = afterInstance.state.$Viewlet;
       $ReferenceNode.before($Child);
@@ -9389,12 +9576,12 @@ const appendWithReferenceNodes = ($Parent, $Child, childId, referenceNodes) => {
 const append = (parentId, childId, referenceNodes) => {
   number(parentId);
   number(childId);
-  const parentInstance = get$9(parentId);
+  const parentInstance = get$a(parentId);
   if (!parentInstance) {
     throw new Error(`cannot append child: instance ${parentId} not found`);
   }
   const $Parent = parentInstance.state.$Viewlet;
-  const childInstance = get$9(childId);
+  const childInstance = get$a(childId);
   if (!childInstance) {
     throw new Error(`cannot append child: child instance not found ${childId}`);
   }
@@ -9413,11 +9600,11 @@ const append = (parentId, childId, referenceNodes) => {
   applyLateFocusMaybe();
 };
 const replaceChildren = (parentId, childIds) => {
-  const parentInstance = get$9(parentId);
+  const parentInstance = get$a(parentId);
   const $Parent = parentInstance.state.$Viewlet;
   const $Fragment = document.createDocumentFragment();
   for (const childId of childIds) {
-    const childInstance = get$9(childId);
+    const childInstance = get$a(childId);
     const $Child = childInstance.state.$Viewlet;
     $Fragment.append($Child);
   }
@@ -9432,7 +9619,7 @@ const applyLateFocusMaybe = () => {
     selector
   } = focusCallback;
   resetFocusCallback();
-  const instance = get$9(id);
+  const instance = get$a(id);
   if (instance) {
     const {
       $Viewlet
@@ -9445,7 +9632,7 @@ const applyLateFocusMaybe = () => {
 };
 const appendToBody = childId => {
   const $Parent = document.body;
-  const childInstance = get$9(childId);
+  const childInstance = get$a(childId);
   const $Child = childInstance.state.$Viewlet;
   $Parent.append($Child);
   applyLateFocusMaybe();
@@ -9458,7 +9645,7 @@ const executeCommands = commands => {
   }
 };
 const show = id => {
-  const instance = get$9(id);
+  const instance = get$a(id);
   const $Viewlet = instance.state.$Viewlet;
   const $Workbench = document.getElementById('Workbench');
   // @ts-expect-error
@@ -9468,7 +9655,7 @@ const show = id => {
   }
 };
 const setBounds$1 = (id, left, top, width, height) => {
-  const instance = get$9(id);
+  const instance = get$a(id);
   if (!instance) {
     return;
   }
@@ -9476,7 +9663,7 @@ const setBounds$1 = (id, left, top, width, height) => {
   setBounds$a($Viewlet, left, top, width, height);
 };
 const setProperty = (id, selector, property, value) => {
-  const instance = get$9(id);
+  const instance = get$a(id);
   if (!instance) {
     return;
   }
@@ -9487,6 +9674,13 @@ const setProperty = (id, selector, property, value) => {
   }
   $Element[property] = value;
 };
+const renderCanvas = (id, selector, canvasClassName, width, height, rectangles, revision) => {
+  const instance = get$a(id);
+  if (!instance) {
+    return;
+  }
+  renderCanvas$1(instance.state.$Viewlet, selector, canvasClassName, width, height, rectangles, revision);
+};
 const commandHandlers = {
   'Css.addCssStyleSheet': addCssStyleSheet,
   'Viewlet.addCss': addCssStyleSheet,
@@ -9510,6 +9704,7 @@ const commandHandlers = {
   'Viewlet.patchCss': patchCssStyleSheet,
   'Viewlet.registerEventListeners': registerEventListeners,
   'Viewlet.removeKeyBindings': removeKeyBindings,
+  'Viewlet.renderCanvas': renderCanvas,
   'Viewlet.replaceChildren': replaceChildren,
   'Viewlet.send': invoke,
   'Viewlet.setBounds': setBounds$1,
@@ -9733,7 +9928,7 @@ const queryAudio = (uid, elementLocator) => {
     // @ts-ignore
     return remoteAudio;
   }
-  const $Viewlet = get$9(uid);
+  const $Viewlet = get$a(uid);
   const remoteAudio = $Viewlet.querySelector(elementLocator);
   if (!remoteAudio) {
     console.error('[webrtc] audio element not found');
@@ -9910,6 +10105,7 @@ const commandMap = {
   'DirectView.getFocusedUid': getFocusedViewUid,
   'DirectView.getUid': getViewUid,
   'Download.downloadFile': downloadFile,
+  'DropData.get': get$6,
   'FileHandles.get': get$5,
   'FilePicker.showDirectoryPicker': showDirectoryPicker,
   'FilePicker.showFilePicker': showFilePicker,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/renderer-process",
-  "version": "30.36.2",
+  "version": "30.38.0",
   "keywords": [
     "lvce-editor",
     "renderer-process"