@lvce-editor/renderer-process 14.1.0 → 14.2.0

package/dist/rendererProcessMain.js

@@ -1091,35 +1091,262 @@ const ReferencePort = 3;
 const ModuleWorkerWithMessagePort = 4;
 const Electron$1 = 5;
 
-const getModule = method => {
-  switch (method) {
-    case ModuleWorker:
-      return Promise.resolve().then(function () { return IpcParentWithModuleWorker; });
-    case MessagePort$1:
-      return Promise.resolve().then(function () { return IpcParentWithMessagePort; });
-    case ReferencePort:
-      return Promise.resolve().then(function () { return IpcParentWithReferencePort; });
-    case ModuleWorkerWithMessagePort:
-      return Promise.resolve().then(function () { return IpcParentWithModuleWorkerWithMessagePort; });
-    case Electron$1:
-      return Promise.resolve().then(function () { return IpcParentWithElectron; });
-    default:
-      throw new Error('unexpected ipc type');
+const Message$2 = 'message';
+const Error$3 = 'error';
+
+const withResolvers = () => {
+  /**
+   * @type {any}
+   */
+  let _resolve;
+  /**
+   * @type {any}
+   */
+  let _reject;
+  const promise = new Promise((resolve, reject) => {
+    _resolve = resolve;
+    _reject = reject;
+  });
+  return {
+    resolve: _resolve,
+    reject: _reject,
+    promise
+  };
+};
+
+const getFirstEvent$1 = (eventTarget, eventMap) => {
+  const {
+    resolve,
+    promise
+  } = withResolvers();
+  const listenerMap = Object.create(null);
+  const cleanup = value => {
+    for (const event of Object.keys(eventMap)) {
+      eventTarget.removeEventListener(event, listenerMap[event]);
+    }
+    resolve(value);
+  };
+  for (const [event, type] of Object.entries(eventMap)) {
+    const listener = event => {
+      cleanup({
+        type,
+        event
+      });
+    };
+    eventTarget.addEventListener(event, listener);
+    listenerMap[event] = listener;
   }
+  return promise;
 };
 
-const ipcs = Object.create(null);
-const set$8 = (name, ipc) => {
-  ipcs[name] = ipc;
+/**
+ *
+ * @param {Worker} worker
+ * @returns
+ */
+const getFirstWorkerEvent$1 = worker => {
+  return getFirstEvent$1(worker, {
+    message: Message$2,
+    error: Error$3
+  });
 };
-const get$7 = name => {
-  return ipcs[name];
+
+const transferrables$1 = [];
+if (typeof MessagePort !== 'undefined') {
+  transferrables$1.push(MessagePort);
+}
+if (typeof OffscreenCanvas !== 'undefined') {
+  transferrables$1.push(OffscreenCanvas);
+}
+
+const isTransferrable$1 = value => {
+  for (const fn of transferrables$1) {
+    if (value instanceof fn) {
+      return true;
+    }
+  }
+  return false;
 };
-const remove$3 = name => {
-  delete ipcs[name];
+
+const walkValue$1 = (value, transferrables) => {
+  if (!value) {
+    return;
+  }
+  if (isTransferrable$1(value)) {
+    transferrables.push(value);
+  }
+  if (Array.isArray(value)) {
+    for (const item of value) {
+      walkValue$1(item, transferrables);
+    }
+    return;
+  }
+  if (typeof value === 'object') {
+    for (const property of Object.values(value)) {
+      walkValue$1(property, transferrables);
+    }
+  }
 };
-const has = name => {
-  return ipcs[name];
+
+const getTransfer = value => {
+  const transferrables = [];
+  walkValue$1(value, transferrables);
+  return transferrables;
+};
+
+let IpcError$1 = class IpcError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = 'IpcError';
+  }
+};
+
+const isErrorEvent$1 = event => {
+  return event instanceof ErrorEvent;
+};
+
+const NewLine$3 = '\n';
+
+const joinLines$2 = lines => {
+  return lines.join(NewLine$3);
+};
+
+const splitLines$2 = lines => {
+  string(lines);
+  return lines.split(NewLine$3);
+};
+
+let WorkerError$1 = class WorkerError extends Error {
+  constructor(event) {
+    super(event.message);
+    const stackLines = splitLines$2(this.stack);
+    const relevantLines = stackLines.slice(1);
+    const relevant = joinLines$2(relevantLines);
+    this.stack = `${event.message}
+    at Module (${event.filename}:${event.lineno}:${event.colno})
+${relevant}`;
+  }
+};
+
+const Module$1 = 'module';
+
+const getWorkerDisplayName$1 = name => {
+  if (name && name.endsWith('Worker')) {
+    return name;
+  }
+  return `${name} worker`;
+};
+const create$H = async ({
+  url,
+  name
+}) => {
+  const worker = new Worker(url, {
+    type: Module$1,
+    name
+  });
+  // @ts-expect-error
+  const {
+    type,
+    event
+  } = await getFirstWorkerEvent$1(worker);
+  switch (type) {
+    case Message$2:
+      if (event.data !== 'ready') {
+        throw new IpcError$1('unexpected first message from worker');
+      }
+      break;
+    case Error$3:
+      if (isErrorEvent$1(event)) {
+        throw new WorkerError$1(event);
+      }
+      const displayName = getWorkerDisplayName$1(name);
+      throw new IpcError$1(`Failed to start ${displayName}`);
+  }
+  return worker;
+};
+const getData$1 = event => {
+  // TODO why are some events not instance of message event?
+  if (event instanceof MessageEvent) {
+    return event.data;
+  }
+  return event;
+};
+const wrap = worker => {
+  let handleMessage;
+  return {
+    get onmessage() {
+      return handleMessage;
+    },
+    set onmessage(listener) {
+      if (listener) {
+        handleMessage = event => {
+          const data = getData$1(event);
+          listener({
+            data,
+            target: this
+          });
+        };
+      } else {
+        handleMessage = null;
+      }
+      worker.onmessage = handleMessage;
+    },
+    send(message) {
+      worker.postMessage(message);
+    },
+    sendAndTransfer(message) {
+      const transfer = getTransfer(message);
+      worker.postMessage(message, transfer);
+    }
+  };
+};
+
+const IpcParentWithModuleWorker$2 = {
+  __proto__: null,
+  create: create$H,
+  wrap
+};
+
+const isMessagePort$1 = value => {
+  return value instanceof MessagePort;
+};
+
+const create$G = async ({
+  url
+}) => {
+  string(url);
+  const portPromise = await new Promise(resolve => {
+    globalThis.acceptPort = resolve;
+  });
+  await import(url);
+  const port = await portPromise;
+  delete globalThis.acceptPort;
+  if (!port) {
+    throw new IpcError$1('port must be defined');
+  }
+  if (!isMessagePort$1(port)) {
+    throw new IpcError$1('port must be of type MessagePort');
+  }
+  return port;
+};
+
+const IpcParentWithMessagePort$2 = {
+  __proto__: null,
+  create: create$G
+};
+
+const create$F = async url => {
+  const referencePort = await new Promise(resolve => {
+    globalThis.acceptReferencePort = resolve;
+    import(url);
+  });
+  delete globalThis.acceptReferencePort;
+  return referencePort;
+};
+
+const IpcParentWithReferencePort = {
+  __proto__: null,
+  create: create$F
 };
 
 const normalizeLine = line => {
@@ -1138,9 +1365,9 @@ const getCombinedMessage = (error, message) => {
   }
   return stringifiedError;
 };
-const NewLine$3 = '\n';
+const NewLine$2 = '\n';
 const getNewLineIndex$1 = (string, startIndex = undefined) => {
-  return string.indexOf(NewLine$3, startIndex);
+  return string.indexOf(NewLine$2, startIndex);
 };
 const mergeStacks$1 = (parent, child) => {
   if (!child) {
@@ -1178,7 +1405,7 @@ let VError$1 = class VError extends Error {
   }
 };
 
-const isMessagePort$1 = value => {
+const isMessagePort = value => {
   return value && value instanceof MessagePort;
 };
 const isMessagePortMain = value => {
@@ -1193,16 +1420,16 @@ const isInstanceOf = (value, constructorName) => {
 const isSocket = value => {
   return isInstanceOf(value, 'Socket');
 };
-const transferrables$1 = [isMessagePort$1, isMessagePortMain, isOffscreenCanvas, isSocket];
-const isTransferrable$1 = value => {
-  for (const fn of transferrables$1) {
+const transferrables = [isMessagePort, isMessagePortMain, isOffscreenCanvas, isSocket];
+const isTransferrable = value => {
+  for (const fn of transferrables) {
     if (fn(value)) {
       return true;
     }
   }
   return false;
 };
-const walkValue$1 = (value, transferrables, isTransferrable) => {
+const walkValue = (value, transferrables, isTransferrable) => {
   if (!value) {
     return;
   }
@@ -1212,20 +1439,20 @@ const walkValue$1 = (value, transferrables, isTransferrable) => {
   }
   if (Array.isArray(value)) {
     for (const item of value) {
-      walkValue$1(item, transferrables, isTransferrable);
+      walkValue(item, transferrables, isTransferrable);
     }
     return;
   }
   if (typeof value === 'object') {
     for (const property of Object.values(value)) {
-      walkValue$1(property, transferrables, isTransferrable);
+      walkValue(property, transferrables, isTransferrable);
     }
     return;
   }
 };
 const getTransferrables = value => {
   const transferrables = [];
-  walkValue$1(value, transferrables, isTransferrable$1);
+  walkValue(value, transferrables, isTransferrable);
   return transferrables;
 };
 const removeValues = (value, toRemove) => {
@@ -1287,9 +1514,9 @@ class Ipc extends EventTarget {
 const E_INCOMPATIBLE_NATIVE_MODULE = 'E_INCOMPATIBLE_NATIVE_MODULE';
 const E_MODULES_NOT_SUPPORTED_IN_ELECTRON = 'E_MODULES_NOT_SUPPORTED_IN_ELECTRON';
 const ERR_MODULE_NOT_FOUND = 'ERR_MODULE_NOT_FOUND';
-const NewLine$2 = '\n';
-const joinLines$2 = lines => {
-  return lines.join(NewLine$2);
+const NewLine$1 = '\n';
+const joinLines$1 = lines => {
+  return lines.join(NewLine$1);
 };
 const RE_AT$1 = /^\s+at/;
 const RE_AT_PROMISE_INDEX$1 = /^\s*at async Promise.all \(index \d+\)$/;
@@ -1300,7 +1527,7 @@ const getDetails$1 = lines => {
   const index = lines.findIndex(isNormalStackLine$1);
   if (index === -1) {
     return {
-      actualMessage: joinLines$2(lines),
+      actualMessage: joinLines$1(lines),
       rest: []
     };
   }
@@ -1315,8 +1542,8 @@ const getDetails$1 = lines => {
     rest: lines.slice(index, lastIndex)
   };
 };
-const splitLines$2 = lines => {
-  return lines.split(NewLine$2);
+const splitLines$1 = lines => {
+  return lines.split(NewLine$1);
 };
 const RE_MESSAGE_CODE_BLOCK_START = /^Error: The module '.*'$/;
 const RE_MESSAGE_CODE_BLOCK_END = /^\s* at/;
@@ -1327,7 +1554,7 @@ const isMessageCodeBlockEndIndex = line => {
   return RE_MESSAGE_CODE_BLOCK_END.test(line);
 };
 const getMessageCodeBlock = stderr => {
-  const lines = splitLines$2(stderr);
+  const lines = splitLines$1(stderr);
   const startIndex = lines.findIndex(isMessageCodeBlockStartIndex);
   const endIndex = startIndex + lines.slice(startIndex).findIndex(isMessageCodeBlockEndIndex, startIndex);
   const relevantLines = lines.slice(startIndex, endIndex);
@@ -1338,7 +1565,7 @@ const isModuleNotFoundMessage = line => {
   return line.includes('[ERR_MODULE_NOT_FOUND]');
 };
 const getModuleNotFoundError = stderr => {
-  const lines = splitLines$2(stderr);
+  const lines = splitLines$1(stderr);
   const messageIndex = lines.findIndex(isModuleNotFoundMessage);
   const message = lines[messageIndex];
   return {
@@ -1386,7 +1613,7 @@ const getHelpfulChildProcessError = (stdout, stderr) => {
   if (isModuleNotFoundError(stderr)) {
     return getModuleNotFoundError(stderr);
   }
-  const lines = splitLines$2(stderr);
+  const lines = splitLines$1(stderr);
   const {
     actualMessage,
     rest
@@ -1397,7 +1624,7 @@ const getHelpfulChildProcessError = (stdout, stderr) => {
     stack: rest
   };
 };
-let IpcError$1 = class IpcError extends VError$1 {
+class IpcError extends VError$1 {
   // @ts-ignore
   constructor(betterMessage, stdout = '', stderr = '') {
     if (stdout || stderr) {
@@ -1422,7 +1649,7 @@ let IpcError$1 = class IpcError extends VError$1 {
     // @ts-ignore
     this.stderr = stderr;
   }
-};
+}
 const readyMessage = 'ready';
 const getData$2 = event => {
   return event.data;
@@ -1490,7 +1717,7 @@ const removeListener = (emitter, type, callback) => {
     emitter.off(type, callback);
   }
 };
-const getFirstEvent$1 = (eventEmitter, eventMap) => {
+const getFirstEvent = (eventEmitter, eventMap) => {
   const {
     resolve,
     promise
@@ -1519,13 +1746,13 @@ const create$5$2 = async ({
   messagePort,
   isMessagePortOpen
 }) => {
-  if (!isMessagePort$1(messagePort)) {
-    throw new IpcError$1('port must be of type MessagePort');
+  if (!isMessagePort(messagePort)) {
+    throw new IpcError('port must be of type MessagePort');
   }
   if (isMessagePortOpen) {
     return messagePort;
   }
-  const eventPromise = getFirstEvent$1(messagePort, {
+  const eventPromise = getFirstEvent(messagePort, {
     message: Message$1
   });
   messagePort.start();
@@ -1534,17 +1761,17 @@ const create$5$2 = async ({
     event
   } = await eventPromise;
   if (type !== Message$1) {
-    throw new IpcError$1('Failed to wait for ipc message');
+    throw new IpcError('Failed to wait for ipc message');
   }
   if (event.data !== readyMessage) {
-    throw new IpcError$1('unexpected first message');
+    throw new IpcError('unexpected first message');
   }
   return messagePort;
 };
 const signal$1 = messagePort => {
   messagePort.start();
 };
-let IpcParentWithMessagePort$1 = class IpcParentWithMessagePort extends Ipc {
+class IpcParentWithMessagePort extends Ipc {
   getData = getData$2;
   send(message) {
     this._rawIpc.postMessage(message);
@@ -1560,28 +1787,28 @@ let IpcParentWithMessagePort$1 = class IpcParentWithMessagePort extends Ipc {
     this._rawIpc.addEventListener('message', callback);
   }
   onClose(callback) {}
-};
+}
 const wrap$5 = messagePort => {
-  return new IpcParentWithMessagePort$1(messagePort);
+  return new IpcParentWithMessagePort(messagePort);
 };
-const IpcParentWithMessagePort$1$1 = {
+const IpcParentWithMessagePort$1 = {
   __proto__: null,
   create: create$5$2,
   signal: signal$1,
   wrap: wrap$5
 };
-const Message$2 = 'message';
+const Message = 'message';
 const Error$1$1 = 'error';
-const getFirstWorkerEvent$1 = worker => {
-  return getFirstEvent$1(worker, {
-    message: Message$2,
+const getFirstWorkerEvent = worker => {
+  return getFirstEvent(worker, {
+    message: Message,
     error: Error$1$1
   });
 };
-const isErrorEvent$1 = event => {
+const isErrorEvent = event => {
   return event instanceof ErrorEvent;
 };
-const getWorkerDisplayName$1 = name => {
+const getWorkerDisplayName = name => {
   if (!name) {
     return '<unknown> worker';
   }
@@ -1593,42 +1820,42 @@ const getWorkerDisplayName$1 = name => {
 const tryToGetActualErrorMessage = async ({
   name
 }) => {
-  const displayName = getWorkerDisplayName$1(name);
+  const displayName = getWorkerDisplayName(name);
   return `Failed to start ${displayName}: Worker Launch Error`;
 };
-let WorkerError$1 = class WorkerError extends Error {
+class WorkerError extends Error {
   constructor(event) {
     super(event.message);
-    const stackLines = splitLines$2(this.stack || '');
+    const stackLines = splitLines$1(this.stack || '');
     const relevantLines = stackLines.slice(1);
-    const relevant = joinLines$2(relevantLines);
+    const relevant = joinLines$1(relevantLines);
     this.stack = `${event.message}
     at Module (${event.filename}:${event.lineno}:${event.colno})
 ${relevant}`;
   }
-};
-const Module$1 = 'module';
+}
+const Module = 'module';
 const create$4$3 = async ({
   url,
   name
 }) => {
   const worker = new Worker(url, {
-    type: Module$1,
+    type: Module,
     name
   });
   const {
     type,
     event
-  } = await getFirstWorkerEvent$1(worker);
+  } = await getFirstWorkerEvent(worker);
   switch (type) {
-    case Message$2:
+    case Message:
       if (event.data !== readyMessage) {
-        throw new IpcError$1('unexpected first message from worker');
+        throw new IpcError('unexpected first message from worker');
       }
       break;
     case Error$1$1:
-      if (isErrorEvent$1(event)) {
-        throw new WorkerError$1(event);
+      if (isErrorEvent(event)) {
+        throw new WorkerError(event);
       }
       const actualErrorMessage = await tryToGetActualErrorMessage({
         name
@@ -1637,16 +1864,16 @@ const create$4$3 = async ({
   }
   return worker;
 };
-const getData$1 = event => {
+const getData = event => {
   // TODO why are some events not instance of message event?
   if (event instanceof MessageEvent) {
     return event.data;
   }
   return event;
 };
-let IpcParentWithModuleWorker$1 = class IpcParentWithModuleWorker extends Ipc {
+class IpcParentWithModuleWorker extends Ipc {
   getData(event) {
-    return getData$1(event);
+    return getData(event);
   }
   send(message) {
     this._rawIpc.postMessage(message);
@@ -1664,11 +1891,11 @@ let IpcParentWithModuleWorker$1 = class IpcParentWithModuleWorker extends Ipc {
   onMessage(callback) {
     this._rawIpc.addEventListener('message', callback);
   }
-};
+}
 const wrap$4 = worker => {
-  return new IpcParentWithModuleWorker$1(worker);
+  return new IpcParentWithModuleWorker(worker);
 };
-const IpcParentWithModuleWorker$1$1 = {
+const IpcParentWithModuleWorker$1 = {
   __proto__: null,
   create: create$4$3,
   wrap: wrap$4
@@ -1683,13 +1910,13 @@ const create$4$2 = (method, params) => {
   };
 };
 const callbacks = Object.create(null);
-const set$7 = (id, fn) => {
+const set$8 = (id, fn) => {
   callbacks[id] = fn;
 };
-const get$6 = id => {
+const get$7 = id => {
   return callbacks[id];
 };
-const remove$2 = id => {
+const remove$3 = id => {
   delete callbacks[id];
 };
 let id = 0;
@@ -1702,7 +1929,7 @@ const registerPromise = () => {
     resolve,
     promise
   } = Promise.withResolvers();
-  set$7(id, resolve);
+  set$8(id, resolve);
   return {
     id,
     promise
@@ -1730,7 +1957,7 @@ class JsonRpcError extends Error {
     this.name = 'JsonRpcError';
   }
 }
-const NewLine$1 = '\n';
+const NewLine = '\n';
 const DomException = 'DOMException';
 const ReferenceError$1 = 'ReferenceError';
 const SyntaxError$1 = 'SyntaxError';
@@ -1775,23 +2002,23 @@ const constructError = (message, type, name) => {
   }
   return new ErrorConstructor(message);
 };
-const joinLines$1 = lines => {
-  return lines.join(NewLine$1);
+const joinLines = lines => {
+  return lines.join(NewLine);
 };
-const splitLines$1 = lines => {
-  return lines.split(NewLine$1);
+const splitLines = lines => {
+  return lines.split(NewLine);
 };
 const getCurrentStack = () => {
-  const currentStack = joinLines$1(splitLines$1(new Error().stack || '').slice(2));
+  const currentStack = joinLines(splitLines(new Error().stack || '').slice(2));
   return currentStack;
 };
 const getNewLineIndex = (string, startIndex = undefined) => {
-  return string.indexOf(NewLine$1, startIndex);
+  return string.indexOf(NewLine, startIndex);
 };
 const getParentStack = error => {
   let parentStack = error.stack || error.data || error.message || '';
   if (parentStack.startsWith('    at')) {
-    parentStack = error.message + NewLine$1 + parentStack;
+    parentStack = error.message + NewLine + parentStack;
   }
   return parentStack;
 };
@@ -1801,21 +2028,21 @@ const restoreJsonRpcError = error => {
   const currentStack = getCurrentStack();
   if (error && error instanceof Error) {
     if (typeof error.stack === 'string') {
-      error.stack = error.stack + NewLine$1 + currentStack;
+      error.stack = error.stack + NewLine + currentStack;
     }
     return error;
   }
   if (error && error.code && error.code === MethodNotFound) {
     const restoredError = new JsonRpcError(error.message);
     const parentStack = getParentStack(error);
-    restoredError.stack = parentStack + NewLine$1 + currentStack;
+    restoredError.stack = parentStack + NewLine + currentStack;
     return restoredError;
   }
   if (error && error.message) {
     const restoredError = constructError(error.message, error.type, error.name);
     if (error.data) {
       if (error.data.stack && error.data.type && error.message) {
-        restoredError.stack = error.data.type + ': ' + error.message + NewLine$1 + error.data.stack + NewLine$1 + currentStack;
+        restoredError.stack = error.data.type + ': ' + error.message + NewLine + error.data.stack + NewLine + currentStack;
       } else if (error.data.stack) {
         restoredError.stack = error.data.stack;
       }
@@ -1866,14 +2093,14 @@ const warn = (...args) => {
   console.warn(...args);
 };
 const resolve = (id, response) => {
-  const fn = get$6(id);
+  const fn = get$7(id);
   if (!fn) {
     console.log(response);
     warn(`callback ${id} may already be disposed`);
     return;
   }
   fn(response);
-  remove$2(id);
+  remove$3(id);
 };
 const E_COMMAND_NOT_FOUND = 'E_COMMAND_NOT_FOUND';
 const getErrorType = prettyError => {
@@ -1929,7 +2156,7 @@ const getErrorResponse = (id, error, preparePrettyError, logError) => {
   const errorProperty = getErrorProperty(error, prettyError);
   return create$1$1(id, errorProperty);
 };
-const create$H = (message, result) => {
+const create$E = (message, result) => {
   return {
     jsonrpc: Two,
     id: message.id,
@@ -1938,7 +2165,7 @@ const create$H = (message, result) => {
 };
 const getSuccessResponse = (message, result) => {
   const resultProperty = result ?? null;
-  return create$H(message, resultProperty);
+  return create$E(message, resultProperty);
 };
 const getErrorResponseSimple = (id, error) => {
   return {
@@ -2145,14 +2372,14 @@ const create$b$1 = async ({
 }) => {
   // TODO create a commandMap per rpc instance
   register(commandMap);
-  const worker = await IpcParentWithModuleWorker$1$1.create({
+  const worker = await IpcParentWithModuleWorker$1.create({
     url,
     name
   });
   if (!isWorker(worker)) {
     throw new Error(`worker must be of type Worker`);
   }
-  const ipc = IpcParentWithModuleWorker$1$1.wrap(worker);
+  const ipc = IpcParentWithModuleWorker$1.wrap(worker);
   handleIpc(ipc);
   const workerRpc = createRpc(ipc);
   return workerRpc;
@@ -2169,14 +2396,14 @@ const create$a$1 = async ({
 }) => {
   // TODO create a commandMap per rpc instance
   register(commandMap);
-  const worker = await IpcParentWithModuleWorker$1$1.create({
+  const worker = await IpcParentWithModuleWorker$1.create({
     url,
     name
   });
   if (!isWorker(worker)) {
     throw new Error(`worker must be of type Worker`);
   }
-  const ipc = IpcParentWithModuleWorker$1$1.wrap(worker);
+  const ipc = IpcParentWithModuleWorker$1.wrap(worker);
   handleIpc(ipc);
   const workerRpc = createRpc(ipc);
   await workerRpc.invokeAndTransfer('initialize', 'message-port', port);
@@ -2193,11 +2420,11 @@ const create$5$1 = async ({
 }) => {
   // TODO create a commandMap per rpc instance
   register(commandMap);
-  const rawIpc = await IpcParentWithMessagePort$1$1.create({
+  const rawIpc = await IpcParentWithMessagePort$1.create({
     messagePort,
     isMessagePortOpen: true
   });
-  const ipc = IpcParentWithMessagePort$1$1.wrap(rawIpc);
+  const ipc = IpcParentWithMessagePort$1.wrap(rawIpc);
   handleIpc(ipc);
   const rpc = createRpc(ipc);
   messagePort.start();
@@ -2217,18 +2444,24 @@ const PlainMessagePortRpcParent = {
   create: create$4$1
 };
 
-const commandMapRef = {};
-
-const launchWorker = async ({
+// TODO add test
+const create$D = async ({
+  url,
   name,
-  url
+  port
 }) => {
-  const rpc = await ModuleWorkerRpcParent.create({
+  await ModuleWorkerWithMessagePortRpcParent.create({
     url,
     name,
-    commandMap: commandMapRef
+    commandMap: {},
+    port
   });
-  return rpc;
+  return undefined;
+};
+
+const IpcParentWithModuleWorkerWithMessagePort = {
+  __proto__: null,
+  create: create$D
 };
 
 const Web = 1;
@@ -2258,6 +2491,75 @@ const getPlatform = () => {
 };
 const platform = getPlatform();
 
+const isElectron = platform === Electron;
+
+// TODO use handleIncomingIpc function
+const create$C = async ({
+  port,
+  ipcId
+}) => {
+  number(ipcId);
+  if (!isElectron) {
+    throw new Error('Electron api was requested but is not available');
+  }
+  const rpc = await ElectronWindowRpcClient.create({
+    commandMap: {},
+    window
+  });
+  const webContentsIds = await rpc.invokeAndTransfer('CreateMessagePort.createMessagePort', ipcId, port);
+  return webContentsIds;
+};
+
+const IpcParentWithElectron = {
+  __proto__: null,
+  create: create$C
+};
+
+const getModule = method => {
+  switch (method) {
+    case ModuleWorker:
+      return IpcParentWithModuleWorker$2;
+    case MessagePort$1:
+      return IpcParentWithMessagePort$2;
+    case ReferencePort:
+      return IpcParentWithReferencePort;
+    case ModuleWorkerWithMessagePort:
+      return IpcParentWithModuleWorkerWithMessagePort;
+    case Electron$1:
+      return IpcParentWithElectron;
+    default:
+      throw new Error('unexpected ipc type');
+  }
+};
+
+const ipcs = Object.create(null);
+const set$7 = (name, ipc) => {
+  ipcs[name] = ipc;
+};
+const get$6 = name => {
+  return ipcs[name];
+};
+const remove$2 = name => {
+  delete ipcs[name];
+};
+const has = name => {
+  return ipcs[name];
+};
+
+const commandMapRef = {};
+
+const launchWorker = async ({
+  name,
+  url
+}) => {
+  const rpc = await ModuleWorkerRpcParent.create({
+    url,
+    name,
+    commandMap: commandMapRef
+  });
+  return rpc;
+};
+
 const getAssetDir = () => {
   // @ts-expect-error
   if (typeof ASSET_DIR !== 'undefined') {
@@ -2335,7 +2637,7 @@ const RendererWorker = {
   state: state$7
 };
 
-const create$G = async ({
+const create$B = async ({
   method,
   ...options
 }) => {
@@ -2345,8 +2647,8 @@ const create$G = async ({
     }
     // TODO rename method
     // TODO avoid cyclic dependency
-    const port = get$7(options.name);
-    remove$3(options.name);
+    const port = get$6(options.name);
+    remove$2(options.name);
     await invokeAndTransfer('Transferrable.transfer', options.id, port);
     return;
   }
@@ -2452,7 +2754,7 @@ const create$Notification = message => {
   $Notification.textContent = message;
   return $Notification;
 };
-const create$F = (type, message) => {
+const create$A = (type, message) => {
   // TODO this pattern might be also useful for activitybar, sidebar etc., creating elements as late as possible, only when actually needed
   const $Notification = create$Notification(message);
   append$1($Notification);
@@ -2514,7 +2816,7 @@ const set$6 = (canvasId, canvas) => {
 const get$4 = id => {
   return get$5(id);
 };
-const create$E = async (canvasId, objectId) => {
+const create$z = async (canvasId, objectId) => {
   const canvas = document.createElement('canvas');
   const offscreenCanvas = canvas.transferControlToOffscreen();
   set$6(canvasId, canvas);
@@ -2568,7 +2870,7 @@ const DragLeave = 'dragleave';
 const DragOver = 'dragover';
 const DragStart = 'dragstart';
 const Drop = 'drop';
-const Error$3 = 'error';
+const Error$2 = 'error';
 const Focus = 'focus';
 const FocusIn = 'focusin';
 const FocusOut = 'focusout';
@@ -3718,7 +4020,7 @@ const showError = (message, y, x) => {
     $ImagePreviewImage
   };
 };
-const create$D = (uri, top, left) => {
+const create$y = (uri, top, left) => {
   const $ImagePreviewImage = document.createElement('img');
   $ImagePreviewImage.className = 'ImagePreviewImage';
   $ImagePreviewImage.src = uri;
@@ -3749,7 +4051,7 @@ const dispose$i = state => {
 
 const ImagePreview$1 = {
   __proto__: null,
-  create: create$D,
+  create: create$y,
   dispose: dispose$i,
   showError,
   update
@@ -3974,7 +4276,7 @@ const ViewletAudio = {
   Events: Events$4
 };
 
-const create$C = () => {
+const create$x = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Clock';
   return {
@@ -3991,7 +4293,7 @@ const setTime = (state, time) => {
 
 const ViewletClock = {
   __proto__: null,
-  create: create$C,
+  create: create$x,
   dispose: dispose$h,
   refresh: refresh$4,
   setTime
@@ -4020,7 +4322,7 @@ const stopTracking$1 = ($Target, pointerId, handlePointerMove, handlePointerUp)
   // TODO use pointerlost event instead
   $Target.removeEventListener(PointerUp, handlePointerUp);
 };
-const create$B = (pointerDown, pointerMove, pointerUp) => {
+const create$w = (pointerDown, pointerMove, pointerUp) => {
   const shared = (fn, event) => {
     const message = fn(event);
     if (!message || message.length === 0) {
@@ -4053,7 +4355,7 @@ const create$B = (pointerDown, pointerMove, pointerUp) => {
 };
 
 const handleOffset = 20;
-const handleSliderPointerDown = create$B(event => {
+const handleSliderPointerDown = create$w(event => {
   const {
     clientX,
     clientY
@@ -4135,7 +4437,7 @@ const ViewletDebugConsoleEvents = {
   handleInput: handleInput$6
 };
 
-const create$A = () => {
+const create$v = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet DebugConsole';
   return {
@@ -4151,7 +4453,7 @@ const setDom$9 = (state, dom) => {
 
 const ViewletDebugConsole = {
   __proto__: null,
-  create: create$A,
+  create: create$v,
   setDom: setDom$9
 };
 
@@ -4212,7 +4514,7 @@ const setMaskImage = ($Element, icon) => {
   }
 };
 
-const create$z = icon => {
+const create$u = icon => {
   const $Icon = document.createElement('div');
   $Icon.className = 'MaskIcon';
   setMaskImage($Icon, icon);
@@ -4222,7 +4524,7 @@ const create$z = icon => {
 
 const create$Button = (label, icon) => {
   // TODO icon div might not be needed (unnecessary html element)
-  const $Icon = create$z(icon);
+  const $Icon = create$u(icon);
   const $Button = document.createElement('button');
   $Button.className = 'IconButton';
   $Button.title = label;
@@ -4243,7 +4545,7 @@ const handleClick$4 = event => {
   handleClick$5(index);
 };
 
-const create$y = () => {
+const create$t = () => {
   const $DialogTitle = document.createElement('h2');
   $DialogTitle.id = 'DialogTitle';
   const $DialogCloseButton = create$Button('Close', 'Close');
@@ -4324,7 +4626,7 @@ const setErrorStack = (state, errorStack) => {
 
 const ViewletDialog = {
   __proto__: null,
-  create: create$y,
+  create: create$t,
   postAppend,
   setButtons,
   setCodeFrame,
@@ -4387,7 +4689,7 @@ const handleContextMenu$8 = event => {
   } = event;
   return ['handleContextMenu', button, clientX, clientY];
 };
-const handleSashCornerPointerDown = create$B(event => {
+const handleSashCornerPointerDown = create$w(event => {
   const {
     clientX,
     clientY
@@ -4736,7 +5038,7 @@ const setNegativeMargin = (state, negativeMargin) => {
   setTop($ListItems, negativeMargin);
 };
 
-const create$x = () => {
+const create$s = () => {
   const $ListItems = document.createElement('div');
   $ListItems.className = 'ListItems';
   $ListItems.role = ListBox;
@@ -4820,7 +5122,7 @@ const setBounds$8 = (state, x, y, width, height) => {
 const ViewletEditorCompletion = {
   __proto__: null,
   attachEvents: attachEvents$9,
-  create: create$x,
+  create: create$s,
   dispose: dispose$f,
   handleError: handleError$7,
   setBounds: setBounds$8,
@@ -4843,7 +5145,7 @@ const ViewletEditorCompletionDetailsEvents = {
   returnValue: returnValue$5
 };
 
-const create$w = () => {
+const create$r = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorCompletionDetails';
   $Viewlet.id = 'CompletionsDetails';
@@ -4884,7 +5186,7 @@ const ViewletEditorCompletionDetails = {
   Events: ViewletEditorCompletionDetailsEvents,
   appendWidget: appendWidget$4,
   attachEvents: attachEvents$8,
-  create: create$w,
+  create: create$r,
   dispose: dispose$e,
   setBounds: setBounds$7,
   setDom: setDom$7
@@ -4903,7 +5205,7 @@ const ViewletEditorCompletionDetails = {
 
 // TODO aria alert
 
-const create$v = () => {
+const create$q = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorError';
   return {
@@ -4925,13 +5227,13 @@ const setBounds$6 = (state, x, y, width, height) => {
 
 const ViewletEditorError = {
   __proto__: null,
-  create: create$v,
+  create: create$q,
   setBounds: setBounds$6,
   setDom: setDom$6
 };
 
 const returnValue$4 = true;
-const handleSashPointerDown$2 = create$B(event => {
+const handleSashPointerDown$2 = create$w(event => {
   const {
     clientX,
     clientY
@@ -5084,7 +5386,7 @@ const handleFocus$7 = event => {
   handleFocus$9(uid);
 };
 
-const create$u = () => {
+const create$p = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorImage';
   return {
@@ -5101,7 +5403,7 @@ const attachEvents$7 = state => {
     [ContextMenu]: handleContextMenu$6,
     [FocusIn]: handleFocus$7
   });
-  $Viewlet.addEventListener(Error$3, handleError$6, Capture);
+  $Viewlet.addEventListener(Error$2, handleError$6, Capture);
   $Viewlet.addEventListener(Wheel, handleWheel$1, Passive);
 };
 const setTransform = (state, transform) => {
@@ -5127,13 +5429,13 @@ const setDom$4 = (state, dom) => {
 const ViewletEditorImage = {
   __proto__: null,
   attachEvents: attachEvents$7,
-  create: create$u,
+  create: create$p,
   setDom: setDom$4,
   setDragging,
   setTransform
 };
 
-const create$t = () => {
+const create$o = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorText';
   $Viewlet.textContent = 'loading...';
@@ -5150,7 +5452,7 @@ const refresh$3 = (state, context) => {
 
 const ViewletEditorPlainText = {
   __proto__: null,
-  create: create$t,
+  create: create$o,
   dispose: dispose$d,
   refresh: refresh$3
 };
@@ -5444,7 +5746,7 @@ const handlePaste = event => {
   const text = getText(clipboardData);
   return ['paste', text];
 };
-const handleScrollBarVerticalPointerDown = create$B(event => {
+const handleScrollBarVerticalPointerDown = create$w(event => {
   const {
     clientY
   } = event;
@@ -5567,7 +5869,7 @@ const setLineInfos = (state, dom) => {
 // 1. create -> only create dom elements
 // 2. render -> fill elements with attributes and data
 // that way all dom nodes can be recycled
-const create$s = () => {
+const create$n = () => {
   const $EditorInput = document.createElement('textarea');
   $EditorInput.className = 'EditorInput';
   $EditorInput.ariaAutoComplete = List;
@@ -5734,7 +6036,7 @@ const setDecorationsDom$1 = (state, decorations) => {
   setDecorationsDom$2(state, decorations);
 };
 
-const create$r = create$s;
+const create$m = create$n;
 const setText$1 = setText$2;
 const setSelections = setSelections$1;
 const setIncrementalEdits = setIncrementalEdits$1;
@@ -5776,7 +6078,7 @@ const setDecorationsDom = setDecorationsDom$1;
 
 const ViewletEditorText = {
   __proto__: null,
-  create: create$r,
+  create: create$m,
   focus: focus$e,
   handleError: handleError$5,
   hideOverlayMessage,
@@ -5792,7 +6094,7 @@ const ViewletEditorText = {
   showOverlayMessage
 };
 
-const create$q = () => {
+const create$l = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorTextError';
   return {
@@ -5808,11 +6110,11 @@ const setMessage$4 = (state, message) => {
 
 const ViewletEditorTextError = {
   __proto__: null,
-  create: create$q,
+  create: create$l,
   setMessage: setMessage$4
 };
 
-const create$p = () => {
+const create$k = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorWidgetError EditorOverlayMessage';
   return {
@@ -5835,12 +6137,12 @@ const setBounds$3 = (state, x, y, width, height) => {
 
 const ViewletEditorWidgetError = {
   __proto__: null,
-  create: create$p,
+  create: create$k,
   setBounds: setBounds$3,
   setMessage: setMessage$3
 };
 
-const create$o = () => {
+const create$j = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.dataset.viewlet = 'Empty';
   $Viewlet.className = 'Viewlet';
@@ -5854,13 +6156,13 @@ const dispose$b = state => {};
 
 const ViewletEmpty = {
   __proto__: null,
-  create: create$o,
+  create: create$j,
   dispose: dispose$b,
   focus: focus$d,
   refresh: refresh$2
 };
 
-const create$n = () => {
+const create$i = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EmptyEditor';
   return {
@@ -5870,10 +6172,10 @@ const create$n = () => {
 
 const ViewletEmptyEditor = {
   __proto__: null,
-  create: create$n
+  create: create$i
 };
 
-const create$m = () => {
+const create$h = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Error';
   return {
@@ -5889,7 +6191,7 @@ const setMessage$2 = (state, message) => {
 
 const ViewletError = {
   __proto__: null,
-  create: create$m,
+  create: create$h,
   setMessage: setMessage$2
 };
 
@@ -6001,7 +6303,7 @@ const handleTouchEnd = event => {
 
 // based on https://github.com/microsoft/vscode/blob/main/src/vs/workbench/contrib/extensions/browser/extensionsList.ts (License MIT)
 
-const create$l = () => {
+const create$g = () => {
   const $ExtensionHeader = document.createElement('div');
   $ExtensionHeader.className = 'ExtensionHeader';
 
@@ -6146,7 +6448,7 @@ const ViewletExtensions = {
   __proto__: null,
   attachEvents: attachEvents$6,
   closeSuggest,
-  create: create$l,
+  create: create$g,
   dispose: dispose$a,
   focus: focus$c,
   handleError: handleError$4,
@@ -6251,7 +6553,7 @@ const ViewletFindWidgetEvents = {
   returnValue: returnValue$3
 };
 
-const create$k = () => {
+const create$f = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet FindWidget';
   $Viewlet.role = Group;
@@ -6314,7 +6616,7 @@ const ViewletFindWidget = {
   __proto__: null,
   Events: Events$3,
   appendWidget: appendWidget$1,
-  create: create$k,
+  create: create$f,
   dispose: dispose$9,
   focus: focus$b,
   setBounds: setBounds$2,
@@ -6969,7 +7271,7 @@ const handleBlur$3 = () => {
 const handleKeyDown$1 = handleKeyDown$2;
 const handleKeyUp = handleKeyUp$1;
 
-const create$j = () => {
+const create$e = () => {
   // TODO use aria role splitter once supported https://github.com/w3c/aria/issues/1348
   const $SashSideBar = document.createElement('div');
   $SashSideBar.className = 'Viewlet Sash SashVertical';
@@ -7025,7 +7327,7 @@ const setSashes = (state, sashSideBar, sashPanel) => {
 const ViewletLayout = {
   __proto__: null,
   attachEvents: attachEvents$5,
-  create: create$j,
+  create: create$e,
   setSashes
 };
 
@@ -7120,7 +7422,7 @@ const handleContextMenu$3 = event => {
 };
 
 // TODO Main should not be bound to Editor -> Lazy load Editor
-const create$i = () => {
+const create$d = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.id = 'Main';
   $Viewlet.className = 'Viewlet Main';
@@ -7220,7 +7522,7 @@ const ViewletMain = {
   attachEvents: attachEvents$4,
   closeAllViewlets,
   closeViewletAndTab,
-  create: create$i,
+  create: create$d,
   dispose: dispose$8,
   focus: focus$9,
   highlightDragOver,
@@ -7297,7 +7599,7 @@ const handleTabsContextMenu = event => {
   handleTabContextMenu(uid, clientX, clientY);
 };
 
-const create$h = () => {
+const create$c = () => {
   const $MainTabs = document.createElement('div');
   $MainTabs.className = 'Viewlet MainTabs';
   $MainTabs.role = TabList;
@@ -7346,7 +7648,7 @@ const setHighlight = (state, highlightLeft) => {
 const ViewletMainTabs = {
   __proto__: null,
   attachEvents: attachEvents$3,
-  create: create$h,
+  create: create$c,
   setHighlight,
   setScrollLeft,
   setTabsDom: setTabsDom$2
@@ -7369,7 +7671,7 @@ const EditorPlainText = 'EditorPlainText';
 const EditorText = 'Editor';
 const EditorWidgetError = 'EditorWidgetError';
 const Empty = 'Empty';
-const Error$2 = 'Error';
+const Error$1 = 'Error';
 const Extensions = 'Extensions';
 const FindWidget = 'FindWidget';
 const ImagePreview = 'ImagePreview';
@@ -7407,7 +7709,7 @@ const EditorTextError = 'EditorTextError';
 const EditorRename = 'EditorRename';
 const EditorCodeGenerator = 'EditorCodeGenerator';
 
-const create$g = () => {
+const create$b = () => {
   const $ViewletOutputContent = document.createElement('div');
   $ViewletOutputContent.className = 'OutputContent';
   $ViewletOutputContent.role = Log;
@@ -7459,7 +7761,7 @@ const dispose$7 = state => {};
 const ViewletOutput = {
   __proto__: null,
   clear: clear$1,
-  create: create$g,
+  create: create$b,
   dispose: dispose$7,
   disposeFindWidget,
   focus: focus$8,
@@ -7520,7 +7822,7 @@ const UiStrings = {
   Close: 'Close',
   Maximize: 'Maximize'
 };
-const create$f = () => {
+const create$a = () => {
   const $PanelTabs = document.createElement('div');
   $PanelTabs.className = 'PanelTabs';
   $PanelTabs.role = TabList;
@@ -7633,7 +7935,7 @@ const setActionsDom$1 = (state, actions, childUid) => {
 const ViewletPanel = {
   __proto__: null,
   attachEvents: attachEvents$2,
-  create: create$f,
+  create: create$a,
   dispose: dispose$6,
   focus: focus$7,
   setActionsDom: setActionsDom$1,
@@ -7724,7 +8026,7 @@ const handleLoadedMetaData = event => {
   target.play();
 };
 
-const create$e = () => {
+const create$9 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet ScreenCapture';
   return {
@@ -7744,7 +8046,7 @@ const setScreenCapture = (state, id) => {
 
 const ViewletScreenCapture = {
   __proto__: null,
-  create: create$e,
+  create: create$9,
   setScreenCapture
 };
 
@@ -7764,7 +8066,7 @@ const handleHeaderClick = event => {
   }
 };
 
-const create$d = () => {
+const create$8 = () => {
   const $SideBarTitleAreaTitle = document.createElement('h2');
   $SideBarTitleAreaTitle.className = 'SideBarTitleAreaTitle';
   const $SideBarTitleArea = document.createElement('div');
@@ -7828,7 +8130,7 @@ const focus$5 = async () => {
 const ViewletSideBar = {
   __proto__: null,
   attachEvents: attachEvents$1,
-  create: create$d,
+  create: create$8,
   dispose: dispose$5,
   focus: focus$5,
   setActionsDom,
@@ -8029,7 +8331,7 @@ const ViewletStatusBarEvents = {
   handleClick: handleClick$2
 };
 
-const create$c = () => {
+const create$7 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.id = 'StatusBar';
   $Viewlet.className = 'Viewlet StatusBar';
@@ -8058,7 +8360,7 @@ const focus$3 = state => {
 
 const ViewletStatusBar = {
   __proto__: null,
-  create: create$c,
+  create: create$7,
   focus: focus$3,
   setDom: setDom$2
 };
@@ -8089,7 +8391,7 @@ const handleClickTab = event => {
   handleClickTab$2(uid, index);
 };
 
-const create$b = () => {
+const create$6 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Terminals';
   return {
@@ -8116,7 +8418,7 @@ const setTabsDom = (state, dom) => {
 
 const ViewletTerminals = {
   __proto__: null,
-  create: create$b,
+  create: create$6,
   setTabsDom
 };
 
@@ -8130,7 +8432,7 @@ const handleContextMenu$1 = event => {
   return ['handleContextMenu', button, clientX, clientY];
 };
 
-const create$a = () => {
+const create$5 = () => {
   // TODO set aria label for title bar menu
   // TODO add tests for aria properties
   const $Viewlet = document.createElement('div');
@@ -8166,7 +8468,7 @@ const setFocused = (state, isFocused) => {
 const ViewletTitleBar = {
   __proto__: null,
   attachEvents,
-  create: create$a,
+  create: create$5,
   setFocused
 };
 
@@ -8541,7 +8843,7 @@ const ViewletTitleBarMenuBar = {
   setMenus
 };
 
-const create$9 = () => {
+const create$4 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet TitleBarTitle';
   return {
@@ -8557,7 +8859,7 @@ const setDom$1 = (state, dom) => {
 
 const ViewletTitleBarTitle = {
   __proto__: null,
-  create: create$9,
+  create: create$4,
   setDom: setDom$1
 };
 
@@ -8743,7 +9045,7 @@ const load$1 = moduleId => {
       return ViewletEditorWidgetError;
     case Empty:
       return ViewletEmpty;
-    case Error$2:
+    case Error$1:
       return ViewletError;
     case Extensions:
       return ViewletExtensions;
@@ -8820,7 +9122,7 @@ const load$1 = moduleId => {
   }
 };
 
-const create$8 = (id, uid = id) => {
+const create$3 = (id, uid = id) => {
   const module = state$1.modules[id];
   if (!module) {
     throw new Error(`module not found: ${id}`);
@@ -9081,7 +9383,7 @@ const sendMultiple = commands => {
         }
       case 'Viewlet.create':
         {
-          create$8(viewletId, method);
+          create$3(viewletId, method);
           break;
         }
       case 'Viewlet.createFunctionalRoot':
@@ -9139,6 +9441,10 @@ const sendMultiple = commands => {
       case 'Viewlet.addKeyBindings':
         addKeyBindings(viewletId, method);
         break;
+      case 'Viewlet.setProperty':
+        // @ts-ignore
+        setProperty(viewletId, method, ...args);
+        break;
       case 'Viewlet.removeKeyBindings':
         removeKeyBindings(viewletId);
         break;
@@ -9327,7 +9633,7 @@ const appendToBody = childId => {
 const getFn = command => {
   switch (command) {
     case 'Viewlet.create':
-      return create$8;
+      return create$3;
     case 'Viewlet.send':
       return invoke;
     case 'Viewlet.show':
@@ -9370,6 +9676,8 @@ const getFn = command => {
       return setDragData;
     case 'Viewlet.focusSelector':
       return focusSelector;
+    case 'Viewlet.setProperty':
+      return setProperty;
     case 'Css.addCssStyleSheet':
     case 'Viewlet.addCss':
     case 'Viewlet.setCss':
@@ -9403,6 +9711,15 @@ const setBounds$1 = (id, left, top, width, height) => {
   const $Viewlet = instance.state.$Viewlet;
   setBounds$a($Viewlet, left, top, width, height);
 };
+const setProperty = (id, selector, property, value) => {
+  const instance = state$1.instances[id];
+  if (!instance) {
+    return;
+  }
+  const $Viewlet = instance.state.$Viewlet;
+  const $Element = $Viewlet.querySelector(selector);
+  $Element[property] = value;
+};
 
 const LocalStorage = 1;
 const SessionStorage = 2;
@@ -9506,29 +9823,9 @@ const handleMessagePort = async port => {
 
 const set = ($Iframe, permissionPolicy) => {
   if (permissionPolicy === undefined) {
-    return;
-  }
-  $Iframe.allow = permissionPolicy;
-};
-
-const withResolvers = () => {
-  /**
-   * @type {any}
-   */
-  let _resolve;
-  /**
-   * @type {any}
-   */
-  let _reject;
-  const promise = new Promise((resolve, reject) => {
-    _resolve = resolve;
-    _reject = reject;
-  });
-  return {
-    resolve: _resolve,
-    reject: _reject,
-    promise
-  };
+    return;
+  }
+  $Iframe.allow = permissionPolicy;
 };
 
 const waitForFrameToLoad = $Frame => {
@@ -9543,7 +9840,7 @@ const waitForFrameToLoad = $Frame => {
 };
 
 // TODO could use browser view when running in electron
-const create$7 = async (uid, src, sandbox, csp, credentialless, permissionPolicy, title) => {
+const create$2 = async (uid, src, sandbox, csp, credentialless, permissionPolicy, title) => {
   const $Iframe = document.createElement('iframe');
   setIframeCredentialless($Iframe, credentialless);
   setIframeCsp($Iframe, csp);
@@ -9624,7 +9921,7 @@ const commandMap = {
   'GetFilePathElectron.getFilePathElectron': getFilePathElectron,
   'HandleMessagePort.handleMessagePort': handleMessagePort,
   'InitData.getInitData': getInitData,
-  'IpcParent.create': create$G,
+  'IpcParent.create': create$B,
   'KeyBindings.setIdentifiers': setIdentifiers,
   'Layout.getBounds': getBounds,
   'Location.getHref': getHref,
@@ -9639,10 +9936,10 @@ const commandMap = {
   'Menu.showControlled': showControlled,
   'Menu.showMenu': showMenu,
   'Meta.setThemeColor': setThemeColor,
-  'Notification.create': create$F,
+  'Notification.create': create$A,
   'Notification.createWithOptions': createWithOptions,
   'Notification.dispose': dispose$j,
-  'OffscreenCanvas.create': create$E,
+  'OffscreenCanvas.create': create$z,
   'Open.openUrl': openUrl,
   'Performance.getMemory': getMemory,
   'Performance.measureUserAgentSpecificMemory': measureUserAgentSpecificMemory,
@@ -9681,7 +9978,7 @@ const commandMap = {
   'WebStorage.setItem': setItem,
   'WebStorage.setJsonObjects': setJsonObjects,
   'WebView.appendOnly': appendOnly,
-  'WebView.create': create$7,
+  'WebView.create': create$2,
   'WebView.dispose': dispose$2,
   'WebView.load': load,
   'WebView.loadOnly': loadOnly,
@@ -9718,7 +10015,7 @@ const getConfiguredEditorWorkerUrl = () => {
 const editorWorkerUrl = getConfiguredEditorWorkerUrl() || `${assetDir}/packages/renderer-worker/node_modules/@lvce-editor/editor-worker/dist/editorWorkerMain.js`;
 
 const launchEditorWorker = async port => {
-  const ipc = await create$G({
+  const ipc = await create$B({
     name: 'Editor Worker',
     url: editorWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -9734,12 +10031,10 @@ const hydrate$2 = async () => {
   } = new MessageChannel();
   // TODO only launch port and send to renderer worker
   const promise = launchEditorWorker(port1);
-  set$8('Editor Worker', port2);
+  set$7('Editor Worker', port2);
   await promise;
 };
 
-const isElectron = platform === Electron;
-
 const getConfiguredExtensionHostWorkerUrl = () => {
   return getConfiguredWorkerUrl('extensionHostWorkerUrl');
 };
@@ -9748,7 +10043,7 @@ const extensionHostWorkerUrl = getConfiguredExtensionHostWorkerUrl() || `${asset
 
 const launchExtensionHostWorker = async port => {
   const name = isElectron ? 'Extension Host (Electron)' : 'Extension Host';
-  const ipc = await create$G({
+  const ipc = await create$B({
     name,
     url: extensionHostWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -9765,14 +10060,14 @@ const hydrate$1 = async () => {
   // TODO only launch port and send to renderer worker
   const promise = launchExtensionHostWorker(port1);
   const name = isElectron ? 'Extension Host (Electron)' : 'Extension Host';
-  set$8(name, port2);
+  set$7(name, port2);
   await promise;
 };
 
 const syntaxHighlightingWorkerUrl = `${assetDir}/packages/renderer-worker/node_modules/@lvce-editor/syntax-highlighting-worker/dist/syntaxHighlightingWorkerMain.js`;
 
 const launchSyntaxHighlightingWorker = async port => {
-  const ipc = await create$G({
+  const ipc = await create$B({
     name: 'Syntax Highlighting Worker',
     url: syntaxHighlightingWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -9788,7 +10083,7 @@ const hydrate = async () => {
   } = new MessageChannel();
   // TODO only launch port and send to renderer worker
   const promise = launchSyntaxHighlightingWorker(port1);
-  set$8('Syntax Highlighting Worker', port2);
+  set$7('Syntax Highlighting Worker', port2);
   await promise;
 };
 
@@ -9857,13 +10152,6 @@ const ViewletEditorRename = {
 const handleContentSecurityPolicyViolation = event => {
 };
 
-const NewLine = '\n';
-
-const splitLines = lines => {
-  string(lines);
-  return lines.split(NewLine);
-};
-
 const RE_AT = /^\s+at/;
 const RE_AT_PROMISE_INDEX = /^\s*at async Promise.all \(index \d+\)$/;
 const RE_OBJECT_AS = /^\s*at Object\.\w+ \[as ([\w.]+)]/;
@@ -9940,7 +10228,7 @@ const mergeCustom = (custom, relevantStack) => {
 };
 const cleanStack = stack => {
   string(stack);
-  const lines = splitLines(stack);
+  const lines = splitLines$2(stack);
   const {
     custom,
     actualStack
@@ -9975,10 +10263,6 @@ const getIsFirefox = () => {
  */
 const isFirefox = getIsFirefox();
 
-const joinLines = lines => {
-  return lines.join(NewLine);
-};
-
 const getErrorMessage = error => {
   if (!error) {
     return `Error: ${error}`;
@@ -10002,7 +10286,7 @@ const prepareErrorMessageWithCodeFrame = error => {
   }
   const message = getErrorMessage(error);
   const lines = cleanStack(error.stack);
-  const relevantStack = joinLines(lines);
+  const relevantStack = joinLines$2(lines);
   if (error.codeFrame) {
     return {
       message,
@@ -10186,275 +10470,6 @@ const main = async () => {
 
 main();
 
-const Message = 'message';
-const Error$1 = 'error';
-
-const getFirstEvent = (eventTarget, eventMap) => {
-  const {
-    resolve,
-    promise
-  } = withResolvers();
-  const listenerMap = Object.create(null);
-  const cleanup = value => {
-    for (const event of Object.keys(eventMap)) {
-      eventTarget.removeEventListener(event, listenerMap[event]);
-    }
-    resolve(value);
-  };
-  for (const [event, type] of Object.entries(eventMap)) {
-    const listener = event => {
-      cleanup({
-        type,
-        event
-      });
-    };
-    eventTarget.addEventListener(event, listener);
-    listenerMap[event] = listener;
-  }
-  return promise;
-};
-
-/**
- *
- * @param {Worker} worker
- * @returns
- */
-const getFirstWorkerEvent = worker => {
-  return getFirstEvent(worker, {
-    message: Message,
-    error: Error$1
-  });
-};
-
-const transferrables = [];
-if (typeof MessagePort !== 'undefined') {
-  transferrables.push(MessagePort);
-}
-if (typeof OffscreenCanvas !== 'undefined') {
-  transferrables.push(OffscreenCanvas);
-}
-
-const isTransferrable = value => {
-  for (const fn of transferrables) {
-    if (value instanceof fn) {
-      return true;
-    }
-  }
-  return false;
-};
-
-const walkValue = (value, transferrables) => {
-  if (!value) {
-    return;
-  }
-  if (isTransferrable(value)) {
-    transferrables.push(value);
-  }
-  if (Array.isArray(value)) {
-    for (const item of value) {
-      walkValue(item, transferrables);
-    }
-    return;
-  }
-  if (typeof value === 'object') {
-    for (const property of Object.values(value)) {
-      walkValue(property, transferrables);
-    }
-  }
-};
-
-const getTransfer = value => {
-  const transferrables = [];
-  walkValue(value, transferrables);
-  return transferrables;
-};
-
-class IpcError extends Error {
-  constructor(message) {
-    super(message);
-    this.name = 'IpcError';
-  }
-}
-
-const isErrorEvent = event => {
-  return event instanceof ErrorEvent;
-};
-
-class WorkerError extends Error {
-  constructor(event) {
-    super(event.message);
-    const stackLines = splitLines(this.stack);
-    const relevantLines = stackLines.slice(1);
-    const relevant = joinLines(relevantLines);
-    this.stack = `${event.message}
-    at Module (${event.filename}:${event.lineno}:${event.colno})
-${relevant}`;
-  }
-}
-
-const Module = 'module';
-
-const getWorkerDisplayName = name => {
-  if (name && name.endsWith('Worker')) {
-    return name;
-  }
-  return `${name} worker`;
-};
-const create$6 = async ({
-  url,
-  name
-}) => {
-  const worker = new Worker(url, {
-    type: Module,
-    name
-  });
-  // @ts-expect-error
-  const {
-    type,
-    event
-  } = await getFirstWorkerEvent(worker);
-  switch (type) {
-    case Message:
-      if (event.data !== 'ready') {
-        throw new IpcError('unexpected first message from worker');
-      }
-      break;
-    case Error$1:
-      if (isErrorEvent(event)) {
-        throw new WorkerError(event);
-      }
-      const displayName = getWorkerDisplayName(name);
-      throw new IpcError(`Failed to start ${displayName}`);
-  }
-  return worker;
-};
-const getData = event => {
-  // TODO why are some events not instance of message event?
-  if (event instanceof MessageEvent) {
-    return event.data;
-  }
-  return event;
-};
-const wrap = worker => {
-  let handleMessage;
-  return {
-    get onmessage() {
-      return handleMessage;
-    },
-    set onmessage(listener) {
-      if (listener) {
-        handleMessage = event => {
-          const data = getData(event);
-          listener({
-            data,
-            target: this
-          });
-        };
-      } else {
-        handleMessage = null;
-      }
-      worker.onmessage = handleMessage;
-    },
-    send(message) {
-      worker.postMessage(message);
-    },
-    sendAndTransfer(message) {
-      const transfer = getTransfer(message);
-      worker.postMessage(message, transfer);
-    }
-  };
-};
-
-const IpcParentWithModuleWorker = {
-  __proto__: null,
-  create: create$6,
-  wrap
-};
-
-const isMessagePort = value => {
-  return value instanceof MessagePort;
-};
-
-const create$5 = async ({
-  url
-}) => {
-  string(url);
-  const portPromise = await new Promise(resolve => {
-    globalThis.acceptPort = resolve;
-  });
-  await import(url);
-  const port = await portPromise;
-  delete globalThis.acceptPort;
-  if (!port) {
-    throw new IpcError('port must be defined');
-  }
-  if (!isMessagePort(port)) {
-    throw new IpcError('port must be of type MessagePort');
-  }
-  return port;
-};
-
-const IpcParentWithMessagePort = {
-  __proto__: null,
-  create: create$5
-};
-
-const create$4 = async url => {
-  const referencePort = await new Promise(resolve => {
-    globalThis.acceptReferencePort = resolve;
-    import(url);
-  });
-  delete globalThis.acceptReferencePort;
-  return referencePort;
-};
-
-const IpcParentWithReferencePort = {
-  __proto__: null,
-  create: create$4
-};
-
-// TODO add test
-const create$3 = async ({
-  url,
-  name,
-  port
-}) => {
-  await ModuleWorkerWithMessagePortRpcParent.create({
-    url,
-    name,
-    commandMap: {},
-    port
-  });
-  return undefined;
-};
-
-const IpcParentWithModuleWorkerWithMessagePort = {
-  __proto__: null,
-  create: create$3
-};
-
-// TODO use handleIncomingIpc function
-const create$2 = async ({
-  port,
-  ipcId
-}) => {
-  number(ipcId);
-  if (!isElectron) {
-    throw new Error('Electron api was requested but is not available');
-  }
-  const rpc = await ElectronWindowRpcClient.create({
-    commandMap: {},
-    window
-  });
-  const webContentsIds = await rpc.invokeAndTransfer('CreateMessagePort.createMessagePort', ipcId, port);
-  return webContentsIds;
-};
-
-const IpcParentWithElectron = {
-  __proto__: null,
-  create: create$2
-};
-
 const isUint8Array = value => {
   return value instanceof Uint8Array;
 };