@lvce-editor/renderer-process 10.58.0 → 10.60.0

package/dist/rendererProcessMain.js

@@ -686,7 +686,7 @@ const getErrorResponse = (message, error, preparePrettyError, logError) => {
   const errorProperty = getErrorProperty(error, prettyError);
   return create$1$1(message, errorProperty);
 };
-const create$M = (message, result) => {
+const create$L = (message, result) => {
   return {
     jsonrpc: Two,
     id: message.id,
@@ -695,7 +695,7 @@ const create$M = (message, result) => {
 };
 const getSuccessResponse = (message, result) => {
   const resultProperty = result ?? null;
-  return create$M(message, resultProperty);
+  return create$L(message, resultProperty);
 };
 const getResponse = async (message, ipc, execute, preparePrettyError, logError, requiresSocket) => {
   try {
@@ -879,7 +879,7 @@ const launchWorker = async ({
   name,
   url
 }) => {
-  const worker = await create$L({
+  const worker = await create$K({
     method: Auto,
     url,
     name
@@ -954,7 +954,7 @@ const hydrate$4 = async () => {
 };
 
 // TODO needed?
-const dispose$n = () => {
+const dispose$m = () => {
   // @ts-expect-error
   if (state$9.rendererWorker) {
     // @ts-expect-error
@@ -977,7 +977,7 @@ const invokeAndTransfer = (method, ...params) => {
 
 const RendererWorker = {
   __proto__: null,
-  dispose: dispose$n,
+  dispose: dispose$m,
   hydrate: hydrate$4,
   invoke: invoke$1,
   invokeAndTransfer,
@@ -986,7 +986,7 @@ const RendererWorker = {
   state: state$9
 };
 
-const create$L = async ({
+const create$K = async ({
   method,
   ...options
 }) => {
@@ -1007,7 +1007,7 @@ const create$L = async ({
 };
 
 const launchEditorWorker = async port => {
-  const ipc = await create$L({
+  const ipc = await create$K({
     name: 'Editor Worker',
     url: editorWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -1037,7 +1037,7 @@ const extensionHostWorkerUrl = getConfiguredExtensionHostWorkerUrl() || `${asset
 
 const launchExtensionHostWorker = async port => {
   const name = isElectron ? 'Extension Host (Electron)' : 'Extension Host';
-  const ipc = await create$L({
+  const ipc = await create$K({
     name,
     url: extensionHostWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -1061,7 +1061,7 @@ const hydrate$2 = async () => {
 const syntaxHighlightingWorkerUrl = `${assetDir}/packages/renderer-worker/node_modules/@lvce-editor/syntax-highlighting-worker/dist/syntaxHighlightingWorkerMain.js`;
 
 const launchSyntaxHighlightingWorker = async port => {
-  const ipc = await create$L({
+  const ipc = await create$K({
     name: 'Syntax Highlighting Worker',
     url: syntaxHighlightingWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -1209,7 +1209,7 @@ var A = "a";
 var Br = "br";
 var Cite = "cite";
 var Data = "data";
-var Time$1 = "time";
+var Time = "time";
 var Tfoot = "tfoot";
 var Ul = "ul";
 var Video$1 = "video";
@@ -1231,7 +1231,7 @@ var Span2 = 8;
 var Table2 = 9;
 var TBody2 = 10;
 var Td2 = 11;
-var Text$2 = 12;
+var Text$1 = 12;
 var Th2 = 13;
 var THead2 = 14;
 var Tr2 = 15;
@@ -1365,7 +1365,7 @@ var getElementTag = type => {
     case Data2:
       return Data;
     case Time2:
-      return Time$1;
+      return Time;
     case Tfoot2:
       return Tfoot;
     case Ul2:
@@ -1551,6 +1551,13 @@ var setProp = ($Element, key, value, eventMap, newEventMap) => {
         $Element.removeAttribute("aria-owns");
       }
       break;
+    case "ariaActivedescendant":
+      if (value) {
+        $Element.setAttribute("aria-activedescendant", value);
+      } else {
+        $Element.removeAttribute("aria-activedescendant");
+      }
+      break;
     case "ariaControls":
       $Element.setAttribute("aria-controls", value);
       break;
@@ -1616,7 +1623,7 @@ var renderDomElement = (element, eventMap, newEventMap) => {
 };
 var render = (element, eventMap, newEventMap) => {
   switch (element.type) {
-    case Text$2:
+    case Text$1:
       return renderDomTextNode(element);
     default:
       return renderDomElement(element, eventMap, newEventMap);
@@ -1715,6 +1722,10 @@ var getEventListenerArg = (param, event) => {
       return event.button;
     case "event.target.value":
       return event.target.value;
+    case "event.isTrusted":
+      return event.isTrusted;
+    case "event.target.className":
+      return event.target.className;
     case "event.data":
       return event.data;
     case "event.deltaMode":
@@ -2011,7 +2022,7 @@ const stopTracking$1 = ($Target, pointerId, handlePointerMove, handlePointerUp)
   // TODO use pointerlost event instead
   $Target.removeEventListener(PointerUp, handlePointerUp);
 };
-const create$K = (pointerDown, pointerMove, pointerUp) => {
+const create$J = (pointerDown, pointerMove, pointerUp) => {
   const shared = (fn, event) => {
     const message = fn(event);
     if (!message || message.length === 0) {
@@ -2044,7 +2055,7 @@ const create$K = (pointerDown, pointerMove, pointerUp) => {
 };
 
 const handleOffset = 20;
-const handleSliderPointerDown = create$K(event => {
+const handleSliderPointerDown = create$J(event => {
   const {
     clientX,
     clientY
@@ -2059,7 +2070,7 @@ const handleSliderPointerDown = create$K(event => {
 }, () => {
   return [];
 });
-const handlePointerDown$7 = event => {
+const handlePointerDown$6 = event => {
   const {
     target
   } = event;
@@ -2072,7 +2083,7 @@ const returnValue$9 = true;
 
 const ViewletColorPickerEvents = {
   __proto__: null,
-  handlePointerDown: handlePointerDown$7,
+  handlePointerDown: handlePointerDown$6,
   returnValue: returnValue$9
 };
 
@@ -2214,9 +2225,9 @@ forwardViewletCommand('focusPrevious');
 const handleAudioError$1 = forwardViewletCommand('handleAudioError');
 const handleBeforeInput$2 = forwardViewletCommand('handleBeforeInput');
 forwardViewletCommand('handleBeforeInputFromContentEditable');
-const handleBlur$b = forwardViewletCommand('handleBlur');
+const handleBlur$a = forwardViewletCommand('handleBlur');
 const handleButtonClick = forwardViewletCommand('handleButtonClick');
-const handleClick$7 = forwardViewletCommand('handleClick');
+const handleClick$6 = forwardViewletCommand('handleClick');
 const handleClickAction$2 = forwardViewletCommand('handleClickAction');
 forwardViewletCommand('handleClickAdd');
 const handleClickAt$3 = forwardViewletCommand('handleClickAt');
@@ -2225,7 +2236,7 @@ forwardViewletCommand('handleClickCopy');
 forwardViewletCommand('handleClickMinimize');
 forwardViewletCommand('handleClickOk');
 forwardViewletCommand('handleClickOpenFile');
-const handleClickOpenFolder$1 = forwardViewletCommand('handleClickOpenFolder');
+forwardViewletCommand('handleClickOpenFolder');
 forwardViewletCommand('handleClickRestore');
 const handleClickTab$2 = forwardViewletCommand('handleClickTab');
 forwardViewletCommand('handleClickToggleMaximize');
@@ -2242,7 +2253,7 @@ forwardViewletCommand('handleClickSize');
 forwardViewletCommand('handleClickDisable');
 forwardViewletCommand('handleClickUninstall');
 forwardViewletCommand('handleFilterInput');
-const handleFocus$b = forwardViewletCommand('handleFocus');
+const handleFocus$a = forwardViewletCommand('handleFocus');
 const handleFocusIn$4 = forwardViewletCommand('handleFocusIn');
 forwardViewletCommand('handleIconError');
 const handleImageError$1 = forwardViewletCommand('handleImageError');
@@ -2257,7 +2268,7 @@ forwardViewletCommand('handleMouseMove');
 const handleMouseOut$1 = forwardViewletCommand('handleMouseOut');
 const handleMouseOver$1 = forwardViewletCommand('handleMouseOver');
 forwardViewletCommand('handlePointerCaptureLost');
-const handlePointerDown$6 = forwardViewletCommand('handlePointerDown');
+const handlePointerDown$5 = forwardViewletCommand('handlePointerDown');
 const handlePointerMove$1 = forwardViewletCommand('handlePointerMove');
 forwardViewletCommand('handlePointerOver');
 const handlePointerUp$1 = forwardViewletCommand('handlePointerUp');
@@ -2301,22 +2312,22 @@ forwardViewletCommand('toggleReplace');
 forwardViewletCommand('toggleUseRegularExpression');
 forwardViewletCommand('type');
 forwardViewletCommand('typeWithAutoClosing');
-const updateEditingValue = forwardViewletCommand('updateEditingValue');
+forwardViewletCommand('updateEditingValue');
 
 const handleFocusIn$3 = event => {
   preventDefault(event);
   const uid = fromEvent(event);
   handleFocusIn$4(uid);
 };
-const handleBlur$a = event => {
+const handleBlur$9 = event => {
   preventDefault(event);
   const uid = fromEvent(event);
-  handleBlur$b(uid);
+  handleBlur$a(uid);
 };
 
 const ViewletEditorCodeGeneratorEvents = {
   __proto__: null,
-  handleBlur: handleBlur$a,
+  handleBlur: handleBlur$9,
   handleFocusIn: handleFocusIn$3
 };
 
@@ -2333,7 +2344,7 @@ const appendWidget$5 = state => {
   } = state;
   append$1($Viewlet);
 };
-const dispose$m = state => {
+const dispose$l = state => {
   remove$2(state.$Viewlet);
 };
 const focus$i = (state, key, source) => {
@@ -2359,7 +2370,7 @@ const ViewletEditorCodeGenerator = {
   __proto__: null,
   Events: ViewletEditorCodeGeneratorEvents,
   appendWidget: appendWidget$5,
-  dispose: dispose$m,
+  dispose: dispose$l,
   focus: focus$i,
   setBounds: setBounds$9
 };
@@ -2380,7 +2391,6 @@ const Status = 'status';
 const TabList = 'tablist';
 const TextBox = 'textbox';
 const ToolBar = 'toolbar';
-const Tree = 'tree';
 const ComboBox = 'combobox';
 
 const attachEvents$c = ($Node, eventMap) => {
@@ -2512,7 +2522,7 @@ const setNegativeMargin = (state, negativeMargin) => {
   setTop($ListItems, negativeMargin);
 };
 
-const create$J = () => {
+const create$I = () => {
   const $ListItems = document.createElement('div');
   $ListItems.className = 'ListItems';
   $ListItems.role = ListBox;
@@ -2565,7 +2575,7 @@ const setDom$a = (state, dom) => {
   // TODO recycle nodes
   // TODO set right aria attributes on $EditorInput
 };
-const dispose$l = state => {
+const dispose$k = state => {
   remove$2(state.$Viewlet);
   // state.$EditorInput.removeAttribute('aria-activedescendant')
 };
@@ -2579,7 +2589,7 @@ const showLoading = (state, x, y) => {
   $Viewlet.append($Loading);
   append$1($Viewlet);
 };
-const handleError$8 = (state, error) => {
+const handleError$7 = (state, error) => {
   const {
     $Viewlet
   } = state;
@@ -2596,9 +2606,9 @@ const setBounds$8 = (state, x, y, width, height) => {
 const ViewletEditorCompletion = {
   __proto__: null,
   attachEvents: attachEvents$b,
-  create: create$J,
-  dispose: dispose$l,
-  handleError: handleError$8,
+  create: create$I,
+  dispose: dispose$k,
+  handleError: handleError$7,
   setBounds: setBounds$8,
   setContentHeight,
   setDom: setDom$a,
@@ -2619,7 +2629,7 @@ const ViewletEditorCompletionDetailsEvents = {
   returnValue: returnValue$8
 };
 
-const create$I = () => {
+const create$H = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorCompletionDetails';
   $Viewlet.id = 'CompletionsDetails';
@@ -2645,7 +2655,7 @@ const appendWidget$4 = state => {
   } = state;
   append$1($Viewlet);
 };
-const dispose$k = state => {
+const dispose$j = state => {
   remove$2(state.$Viewlet);
 };
 const setBounds$7 = (state, x, y, width, height) => {
@@ -2660,8 +2670,8 @@ const ViewletEditorCompletionDetails = {
   Events: ViewletEditorCompletionDetailsEvents,
   appendWidget: appendWidget$4,
   attachEvents: attachEvents$a,
-  create: create$I,
-  dispose: dispose$k,
+  create: create$H,
+  dispose: dispose$j,
   setBounds: setBounds$7,
   setDom: setDom$9
 };
@@ -2669,7 +2679,7 @@ const ViewletEditorCompletionDetails = {
 const rememberFocus = rememberFocus$1;
 
 const returnValue$7 = true;
-const handleSashPointerDown$2 = create$K(event => {
+const handleSashPointerDown$2 = create$J(event => {
   const {
     clientX,
     clientY
@@ -2728,7 +2738,7 @@ const handleFocusIn$2 = event => {
   const uid = fromEvent(event);
   handleFocusIn$4(uid);
 };
-const handleBlur$9 = event => {
+const handleBlur$8 = event => {
   const uid = fromEvent(event);
   executeViewletCommand(uid, 'EditorRename.handleBlur');
 };
@@ -2745,7 +2755,7 @@ const handleInput$6 = event => {
 
 const ViewletEditorRenameEvents = {
   __proto__: null,
-  handleBlur: handleBlur$9,
+  handleBlur: handleBlur$8,
   handleFocusIn: handleFocusIn$2,
   handleInput: handleInput$6
 };
@@ -2763,7 +2773,7 @@ const appendWidget$2 = state => {
   } = state;
   append$1($Viewlet);
 };
-const dispose$j = state => {
+const dispose$i = state => {
   remove$2(state.$Viewlet);
 };
 
@@ -2771,7 +2781,7 @@ const ViewletEditorRename = {
   __proto__: null,
   Events: ViewletEditorRenameEvents,
   appendWidget: appendWidget$2,
-  dispose: dispose$j,
+  dispose: dispose$i,
   setBounds: setBounds$5
 };
 
@@ -2799,7 +2809,7 @@ const appendWidget$1 = state => {
   } = state;
   append$1($Viewlet);
 };
-const dispose$i = state => {
+const dispose$h = state => {
   remove$2(state.$Viewlet);
 };
 
@@ -2807,7 +2817,7 @@ const ViewletEditorSourceActions = {
   __proto__: null,
   Events: ViewletEditorSourceActionsEvents,
   appendWidget: appendWidget$1,
-  dispose: dispose$i,
+  dispose: dispose$h,
   setBounds: setBounds$4
 };
 
@@ -2859,7 +2869,7 @@ const handleReplaceInput = event => {
 const handleReplaceFocus = event => {
   return ['FindWidget.handleReplaceFocus'];
 };
-const handleFocus$a = event => {
+const handleFocus$9 = event => {
   return ['FindWidget.handleFocus'];
 };
 const handleToggleReplaceFocus = event => {
@@ -2887,7 +2897,7 @@ const ViewletFindWidgetEvents = {
   handleClickReplace,
   handleClickReplaceAll,
   handleClickToggleReplace,
-  handleFocus: handleFocus$a,
+  handleFocus: handleFocus$9,
   handleFocusClose,
   handleFocusNext,
   handleFocusPrevious,
@@ -2900,7 +2910,7 @@ const ViewletFindWidgetEvents = {
   returnValue: returnValue$6
 };
 
-const create$H = () => {
+const create$G = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet FindWidget';
   $Viewlet.role = Group;
@@ -2954,17 +2964,17 @@ const setBounds$3 = (state, x, y, width, height) => {
   } = state;
   setBounds$a($Viewlet, x, y, width, height);
 };
-const dispose$h = state => {
+const dispose$g = state => {
   remove$2(state.$Viewlet);
 };
-const Events$a = ViewletFindWidgetEvents;
+const Events$9 = ViewletFindWidgetEvents;
 
 const ViewletFindWidget = {
   __proto__: null,
-  Events: Events$a,
+  Events: Events$9,
   appendWidget,
-  create: create$H,
-  dispose: dispose$h,
+  create: create$G,
+  dispose: dispose$g,
   focus: focus$h,
   setBounds: setBounds$3,
   setDom: setDom$7,
@@ -2990,7 +3000,6 @@ const EditorText = 'Editor';
 const EditorWidgetError = 'EditorWidgetError';
 const Empty = 'Empty';
 const Error$2 = 'Error';
-const Explorer = 'Explorer';
 const Extensions = 'Extensions';
 const FindWidget = 'FindWidget';
 const ImagePreview$1 = 'ImagePreview';
@@ -3314,7 +3323,7 @@ const logError = async (error, prefix = '') => {
   print(prettyError, prefix);
   return prettyError;
 };
-const handleError$7 = async (error, notify = true, prefix = '') => {
+const handleError$6 = async (error, notify = true, prefix = '') => {
   try {
     const prettyError = await logError(error, prefix);
     if (notify) {
@@ -3333,14 +3342,14 @@ const isChromeExtensionError = error => {
 
 const handleUnhandledRejection = event => {
   event.preventDefault();
-  handleError$7(event.reason, true, '[renderer process] Unhandled Rejection: ');
+  handleError$6(event.reason, true, '[renderer process] Unhandled Rejection: ');
 };
 const handleUnhandledError = (message, filename, lineno, colno, error) => {
   if (isChromeExtensionError(message)) {
     // ignore errors from chrome extensions
     return;
   }
-  handleError$7(error, Boolean(error), '[renderer-process] Unhandled Error: ');
+  handleError$6(error, Boolean(error), '[renderer-process] Unhandled Error: ');
 };
 
 const handleWindowMessage = event => {
@@ -3468,7 +3477,7 @@ const getWorkerDisplayName = name => {
   }
   return `${name} worker`;
 };
-const create$G = async ({
+const create$F = async ({
   url,
   name
 }) => {
@@ -3535,7 +3544,7 @@ const wrap = worker => {
 
 const IpcParentWithModuleWorker = {
   __proto__: null,
-  create: create$G,
+  create: create$F,
   wrap
 };
 
@@ -3543,7 +3552,7 @@ const isMessagePort$1 = value => {
   return value instanceof MessagePort;
 };
 
-const create$F = async ({
+const create$E = async ({
   url
 }) => {
   string(url);
@@ -3564,10 +3573,10 @@ const create$F = async ({
 
 const IpcParentWithMessagePort = {
   __proto__: null,
-  create: create$F
+  create: create$E
 };
 
-const create$E = async url => {
+const create$D = async url => {
   const referencePort = await new Promise(resolve => {
     globalThis.acceptReferencePort = resolve;
     import(url);
@@ -3578,7 +3587,7 @@ const create$E = async url => {
 
 const IpcParentWithReferencePort = {
   __proto__: null,
-  create: create$E
+  create: create$D
 };
 
 const isWorker = value => {
@@ -3586,12 +3595,12 @@ const isWorker = value => {
 };
 
 // TODO add test
-const create$D = async ({
+const create$C = async ({
   url,
   name,
   port
 }) => {
-  const worker = await create$G({
+  const worker = await create$F({
     url,
     name
   });
@@ -3610,7 +3619,7 @@ const create$D = async ({
 
 const IpcParentWithModuleWorkerWithMessagePort = {
   __proto__: null,
-  create: create$D
+  create: create$C
 };
 
 const handleIpcOnce = ipc => {
@@ -4137,7 +4146,7 @@ const IpcChildWithModuleWorkerAndMessagePort$1 = {
 };
 
 // TODO use handleIncomingIpc function
-const create$C = async ({
+const create$B = async ({
   port,
   ipcId
 }) => {
@@ -4153,7 +4162,7 @@ const create$C = async ({
 
 const IpcParentWithElectron = {
   __proto__: null,
-  create: create$C
+  create: create$B
 };
 
 const play = async src => {
@@ -4384,7 +4393,7 @@ const AriaAlert = {
 // but that's difficult to know
 
 // TODO hide widget after timeout or mousemove
-const create$B = (message, x, y) => {
+const create$A = (message, x, y) => {
   const $EditorError = document.createElement('div');
   $EditorError.className = 'EditorWidgetError';
   $EditorError.textContent = message;
@@ -4399,7 +4408,7 @@ const create$B = (message, x, y) => {
 
 const name$s = 'EditorError';
 const Commands$t = {
-  create: create$B
+  create: create$A
 };
 
 const EditorError_ipc = {
@@ -4483,7 +4492,7 @@ const showError = (message, y, x) => {
     $ImagePreviewImage
   };
 };
-const create$A = (uri, top, left) => {
+const create$z = (uri, top, left) => {
   const $ImagePreviewImage = document.createElement('img');
   $ImagePreviewImage.className = 'ImagePreviewImage';
   $ImagePreviewImage.src = uri;
@@ -4508,22 +4517,22 @@ const create$A = (uri, top, left) => {
 const update = (state, uri) => {
   state.$ImagePreviewImage.uri = uri;
 };
-const dispose$g = state => {
+const dispose$f = state => {
   remove$2(state.$ImagePreview);
 };
 
 const ImagePreview = {
   __proto__: null,
-  create: create$A,
-  dispose: dispose$g,
+  create: create$z,
+  dispose: dispose$f,
   showError,
   update
 };
 
 const name$p = 'ImagePreview';
 const Commands$q = {
-  create: create$A,
-  dispose: dispose$g,
+  create: create$z,
+  dispose: dispose$f,
   showError: showError,
   update: update
 };
@@ -4600,7 +4609,7 @@ const InitData_ipc = {
 
 const name$n = 'IpcParent';
 const Commands$o = {
-  create: create$L
+  create: create$K
 };
 
 const IpcParent_ipc = {
@@ -4720,7 +4729,7 @@ const create$Notification = message => {
   $Notification.textContent = message;
   return $Notification;
 };
-const create$z = (type, message) => {
+const create$y = (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);
@@ -4765,7 +4774,7 @@ const createWithOptions = (type, message, options) => {
   const $Notification = create$NotificationWithOptions(message, options);
   append$1($Notification);
 };
-const dispose$f = id => {
+const dispose$e = id => {
   // const $Notification = state.$Notifications
 };
 
@@ -4773,9 +4782,9 @@ const name$h = 'Notification';
 
 // prettier-ignore
 const Commands$i = {
-  create: create$z,
+  create: create$y,
   createWithOptions: createWithOptions,
-  dispose: dispose$f
+  dispose: dispose$e
 };
 
 const Notification_ipc = {
@@ -4797,7 +4806,7 @@ const set$4 = (canvasId, canvas) => {
 const get$3 = id => {
   return get$4(id);
 };
-const create$y = async (canvasId, objectId) => {
+const create$x = async (canvasId, objectId) => {
   const canvas = document.createElement('canvas');
   const offscreenCanvas = canvas.transferControlToOffscreen();
   set$4(canvasId, canvas);
@@ -4808,7 +4817,7 @@ const name$g = 'OffscreenCanvas';
 
 // prettier-ignore
 const Commands$h = {
-  create: create$y
+  create: create$x
 };
 
 const OffscreenCanvas_ipc = {
@@ -4873,7 +4882,6 @@ const focusPrevious = () => {
 };
 
 const FocusDebugInput = 6;
-const FocusExplorerEditBox = 14;
 const FocusLocationList = 17;
 const FocusMenu = 18;
 const FocusQuickPickInput = 20;
@@ -4961,7 +4969,7 @@ const handleMouseDown$3 = event => {
  *
  * @param {MouseEvent} event
  */
-const handleMouseEnter$1 = event => {
+const handleMouseEnter = event => {
   const {
     target,
     clientX,
@@ -4976,7 +4984,7 @@ const handleMouseEnter$1 = event => {
   const level = getLevel($Menu);
   send(/* Menu.handleMouseEnter */'Menu.handleMouseEnter', /* level */level, /* index */index, /* x */clientX, /* y */clientY, /* timeStamp */timeStamp);
 };
-const handleMouseLeave$1 = event => {
+const handleMouseLeave = event => {
   const $RelatedTarget = event.relatedTarget;
   if ($RelatedTarget.classList.contains('MenuItem')) ;
   // RendererWorker.send(/* Menu.handleMouseLeave */ 'Menu.handleMouseLeave')
@@ -4998,10 +5006,10 @@ const create$Menu$1 = () => {
   // $ContextMenu.onmousedown = contextMenuHandleMouseDown
   // TODO mousedown vs click? (click is usually better but mousedown is faster, why wait 100ms?)
   $Menu.addEventListener(MouseDown, handleMouseDown$3);
-  $Menu.addEventListener(MouseEnter, handleMouseEnter$1, {
+  $Menu.addEventListener(MouseEnter, handleMouseEnter, {
     capture: true
   });
-  $Menu.addEventListener(MouseLeave, handleMouseLeave$1, {
+  $Menu.addEventListener(MouseLeave, handleMouseLeave, {
     capture: true
   });
   // $Menu.addEventListener('mousemove', handleMouseMove, {
@@ -5265,7 +5273,7 @@ const start = async (id, options) => {
     throw new VError$1(error, `Failed to start screen capture`);
   }
 };
-const dispose$e = async (id, options) => {
+const dispose$d = async (id, options) => {
   try {
     number(id);
     const captureStream = get$2(id);
@@ -5280,7 +5288,7 @@ const dispose$e = async (id, options) => {
 
 const name$b = 'ScreenCapture';
 const Commands$c = {
-  dispose: dispose$e,
+  dispose: dispose$d,
   start: start
 };
 
@@ -5290,6 +5298,113 @@ const ScreenCapture_ipc = {
   name: name$b
 };
 
+const getTimeStamp = () => {
+  return performance.now();
+};
+
+const waitForMutation = async maxDelay => {
+  const disposables = [];
+  await Promise.race([new Promise(resolve => {
+    const timeout = setTimeout(resolve, maxDelay);
+    // @ts-expect-error
+    disposables.push(() => {
+      clearTimeout(timeout);
+    });
+  }), new Promise(resolve => {
+    const callback = mutations => {
+      resolve(undefined);
+    };
+    const observer = new MutationObserver(callback);
+    observer.observe(document.body, {
+      childList: true,
+      attributes: true,
+      characterData: true,
+      subtree: true,
+      attributeOldValue: true,
+      characterDataOldValue: true
+    });
+    // @ts-expect-error
+    disposables.push(() => {
+      observer.disconnect();
+    });
+  })]);
+  for (const disposable of disposables) {
+    // @ts-expect-error
+    disposable();
+  }
+};
+
+const getEventClass = eventType => {
+  switch (eventType) {
+    case Wheel:
+      return WheelEvent;
+    case PointerDown:
+    case PointerUp:
+    case PointerMove:
+      return PointerEvent;
+    default:
+      return Event;
+  }
+};
+
+const mouseEvent = (element, eventType, options) => {
+  const event = new MouseEvent(eventType, options);
+  element.dispatchEvent(event);
+};
+const mouseDown = (element, options) => {
+  mouseEvent(element, MouseDown, options);
+};
+const mouseUp = (element, options) => {
+  mouseEvent(element, MouseUp, options);
+};
+const contextMenu = (element, options) => {
+  mouseEvent(element, ContextMenu, options);
+};
+const click = (element, options) => {
+  mouseDown(element, options);
+  mouseEvent(element, Click, options);
+  mouseUp(element, options);
+  if (options.button === 2 /* right */) {
+    contextMenu(element, options);
+  }
+};
+const hover = (element, options) => {
+  mouseEvent(element, MouseEnter, options);
+};
+const type = (element, options) => {
+  element.value = options.text;
+};
+const keyboardEvent = (element, eventType, options) => {
+  const event = new KeyboardEvent(eventType, options);
+  element.dispatchEvent(event);
+};
+const keyDown = (element, options) => {
+  keyboardEvent(element, KeyDown, options);
+};
+const keyUp = (element, options) => {
+  keyboardEvent(element, KeyUp, options);
+};
+const dispatchEvent = (element, options) => {
+  const EventClass = getEventClass(options.type);
+  const event = new EventClass(options.type, options.init);
+  element.dispatchEvent(event);
+};
+
+const ElementActions = {
+  __proto__: null,
+  click,
+  contextMenu,
+  dispatchEvent,
+  hover,
+  keyDown,
+  keyUp,
+  keyboardEvent,
+  mouseDown,
+  mouseEvent,
+  mouseUp,
+  type
+};
+
 const htmlElements = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdo', 'body', 'br', 'button', 'canvas', 'caption', 'center', 'cite', 'code', 'col', 'colgroup', 'command', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'label', 'legend', 'li', 'link', 'map', 'mark', 'menu', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'pre', 'progress', 'q', 'rp', 'rt', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr'];
 
 const querySelectorByText = (root, text) => {
@@ -5365,6 +5480,30 @@ const querySelectorWithOptions = (selector, {
   return element;
 };
 
+// TODO this should also come in via options
+const maxTimeout$1 = 2000;
+const performAction2 = async (locator, fnName, options) => {
+  object(locator);
+  string(fnName);
+  object(options);
+  const startTime = getTimeStamp();
+  const endTime = startTime + maxTimeout$1;
+  let currentTime = startTime;
+  const fn = ElementActions[fnName];
+  while (currentTime < endTime) {
+    const element = querySelectorWithOptions(locator._selector, {
+      hasText: locator._hasText,
+      nth: locator._nth
+    });
+    if (element) {
+      fn(element, options);
+      return;
+    }
+    await waitForMutation(100);
+    currentTime = getTimeStamp();
+  }
+};
+
 const toBeVisible$1 = locator => {
   return `expected selector to be visible ${locator._selector}`;
 };
@@ -5501,76 +5640,6 @@ const getFunction = fnName => {
   }
 };
 
-const mouseEvent = (element, eventType, options) => {
-  const event = new MouseEvent(eventType, options);
-  element.dispatchEvent(event);
-};
-const mouseDown = (element, options) => {
-  mouseEvent(element, MouseDown, options);
-};
-const mouseUp = (element, options) => {
-  mouseEvent(element, MouseUp, options);
-};
-const contextMenu = (element, options) => {
-  mouseEvent(element, ContextMenu, options);
-};
-const click = (element, options) => {
-  mouseDown(element, options);
-  mouseEvent(element, Click, options);
-  mouseUp(element, options);
-  if (options.button === 2 /* right */) {
-    contextMenu(element, options);
-  }
-};
-const hover = (element, options) => {
-  mouseEvent(element, MouseEnter, options);
-};
-const type = (element, options) => {
-  element.value = options.text;
-};
-const keyboardEvent = (element, eventType, options) => {
-  const event = new KeyboardEvent(eventType, options);
-  element.dispatchEvent(event);
-};
-const keyDown = (element, options) => {
-  keyboardEvent(element, KeyDown, options);
-};
-const keyUp = (element, options) => {
-  keyboardEvent(element, KeyUp, options);
-};
-const getEventClass = eventType => {
-  switch (eventType) {
-    case Wheel:
-      return WheelEvent;
-    case PointerDown:
-    case PointerUp:
-    case PointerMove:
-      return PointerEvent;
-    default:
-      return Event;
-  }
-};
-const dispatchEvent = (element, options) => {
-  const EventClass = getEventClass(options.type);
-  const event = new EventClass(options.type, options.init);
-  element.dispatchEvent(event);
-};
-
-const ElementActions = {
-  __proto__: null,
-  click,
-  contextMenu,
-  dispatchEvent,
-  hover,
-  keyDown,
-  keyUp,
-  keyboardEvent,
-  mouseDown,
-  mouseEvent,
-  mouseUp,
-  type
-};
-
 const press = options => {
   const element = document.activeElement;
   keyDown(element, options);
@@ -5684,53 +5753,12 @@ const showOverlay = (state, background, text) => {
   $TestOverlay.textContent = text;
   document.body.append($TestOverlay);
 };
-const Time = {
-  getTimeStamp() {
-    return performance.now();
-  }
-};
 const maxTimeout = 2000;
-const Timeout = {
-  async short() {
-    await new Promise(resolve => setTimeout(resolve, 1000));
-  },
-  async waitForMutation(maxDelay) {
-    const disposables = [];
-    await Promise.race([new Promise(resolve => {
-      const timeout = setTimeout(resolve, maxDelay);
-      // @ts-expect-error
-      disposables.push(() => {
-        clearTimeout(timeout);
-      });
-    }), new Promise(resolve => {
-      const callback = mutations => {
-        resolve(undefined);
-      };
-      const observer = new MutationObserver(callback);
-      observer.observe(document.body, {
-        childList: true,
-        attributes: true,
-        characterData: true,
-        subtree: true,
-        attributeOldValue: true,
-        characterDataOldValue: true
-      });
-      // @ts-expect-error
-      disposables.push(() => {
-        observer.disconnect();
-      });
-    })]);
-    for (const disposable of disposables) {
-      // @ts-expect-error
-      disposable();
-    }
-  }
-};
 const performAction = async (locator, fnName, options) => {
   object(locator);
   string(fnName);
   object(options);
-  const startTime = Time.getTimeStamp();
+  const startTime = getTimeStamp();
   const endTime = startTime + maxTimeout;
   let currentTime = startTime;
   const fn = ElementActions[fnName];
@@ -5743,8 +5771,8 @@ const performAction = async (locator, fnName, options) => {
       fn(element, options);
       return;
     }
-    await Timeout.waitForMutation(100);
-    currentTime = Time.getTimeStamp();
+    await waitForMutation(100);
+    currentTime = getTimeStamp();
   }
 };
 const performKeyBoardAction = (fnName, options) => {
@@ -5758,7 +5786,7 @@ class AssertionError extends Error {
   }
 }
 const checkSingleElementCondition = async (locator, fnName, options) => {
-  const startTime = Time.getTimeStamp();
+  const startTime = getTimeStamp();
   const endTime = startTime + maxTimeout;
   let currentTime = startTime;
   const fn = SingleElementConditions[fnName];
@@ -5773,15 +5801,15 @@ const checkSingleElementCondition = async (locator, fnName, options) => {
         return;
       }
     }
-    await Timeout.waitForMutation(100);
-    currentTime = Time.getTimeStamp();
+    await waitForMutation(100);
+    currentTime = getTimeStamp();
   }
   const errorMessageFn = getFunction(fnName);
   const message = errorMessageFn(locator, options);
   throw new AssertionError(message);
 };
 const checkMultiElementCondition = async (locator, fnName, options) => {
-  const startTime = Time.getTimeStamp();
+  const startTime = getTimeStamp();
   const endTime = startTime + maxTimeout;
   let currentTime = startTime;
   const fn = MultiElementConditions[fnName];
@@ -5791,8 +5819,8 @@ const checkMultiElementCondition = async (locator, fnName, options) => {
     if (successful) {
       return;
     }
-    await Timeout.waitForMutation(100);
-    currentTime = Time.getTimeStamp();
+    await waitForMutation(100);
+    currentTime = getTimeStamp();
   }
   const errorMessageFn = getFunction(fnName);
   const message = errorMessageFn(locator, options);
@@ -5800,12 +5828,11 @@ const checkMultiElementCondition = async (locator, fnName, options) => {
 };
 
 const name$a = 'TestFrameWork';
-
-// prettier-ignore
 const Commands$b = {
   checkMultiElementCondition: checkMultiElementCondition,
   checkSingleElementCondition: checkSingleElementCondition,
   performAction: performAction,
+  performAction2: performAction2,
   performKeyBoardAction: performKeyBoardAction,
   showOverlay: showOverlay
 };
@@ -5938,8 +5965,6 @@ const load$1 = moduleId => {
       return Promise.resolve().then(function () { return ViewletEmpty; });
     case Error$2:
       return Promise.resolve().then(function () { return ViewletError; });
-    case Explorer:
-      return Promise.resolve().then(function () { return ViewletExplorer; });
     case Extensions:
       return Promise.resolve().then(function () { return ViewletExtensions; });
     case FindWidget:
@@ -6017,7 +6042,7 @@ const load$1 = moduleId => {
   }
 };
 
-const create$x = (id, uid = id) => {
+const create$w = (id, uid = id) => {
   const module = state$6.modules[id];
   if (!module) {
     throw new Error(`module not found: ${id}`);
@@ -6240,7 +6265,7 @@ const sendMultiple = commands => {
         }
       case 'Viewlet.create':
         {
-          create$x(viewletId, method);
+          create$w(viewletId, method);
           break;
         }
       case 'Viewlet.createFunctionalRoot':
@@ -6257,7 +6282,7 @@ const sendMultiple = commands => {
         }
       case 'Viewlet.dispose':
         {
-          dispose$d(viewletId);
+          dispose$c(viewletId);
           break;
         }
       case 'Viewlet.setPatches':
@@ -6275,7 +6300,7 @@ const sendMultiple = commands => {
       case 'Viewlet.handleError':
         {
           // @ts-expect-error
-          handleError$6(viewletId, method, ...args);
+          handleError$5(viewletId, method, ...args);
           break;
         }
       case 'Viewlet.focus':
@@ -6327,7 +6352,7 @@ const sendMultiple = commands => {
     }
   }
 };
-const dispose$d = id => {
+const dispose$c = id => {
   try {
     number(id);
     const {
@@ -6349,7 +6374,7 @@ const dispose$d = id => {
     throw new Error(`Failed to dispose ${id}`);
   }
 };
-const handleError$6 = (id, parentId, message) => {
+const handleError$5 = (id, parentId, message) => {
   info(`[viewlet-error] ${id}: ${message}`);
   const instance = state$6.instances[id];
   if (instance?.state.$Viewlet.isConnected) {
@@ -6452,13 +6477,13 @@ const appendToBody = childId => {
 const getFn = command => {
   switch (command) {
     case 'Viewlet.create':
-      return create$x;
+      return create$w;
     case 'Viewlet.send':
       return invoke;
     case 'Viewlet.show':
       return show;
     case 'Viewlet.dispose':
-      return dispose$d;
+      return dispose$c;
     case 'Viewlet.setDom2':
       return setDom2;
     case 'Viewlet.setBounds':
@@ -6524,12 +6549,12 @@ const name$8 = 'Viewlet';
 const Commands$9 = {
   addKeyBindings: addKeyBindings,
   appendViewlet: appendViewlet,
-  dispose: dispose$d,
+  dispose: dispose$c,
   executeCommands: executeCommands,
   focus: focus$f,
   focusElementByName: focusElementByName,
   focusSelector: focusSelector,
-  handleError: handleError$6,
+  handleError: handleError$5,
   invoke: invoke,
   loadModule: loadModule,
   refresh: refresh$4,
@@ -6823,7 +6848,7 @@ const waitForFrameToLoad = $Frame => {
 };
 
 // TODO could use browser view when running in electron
-const create$w = async (uid, src, sandbox, csp, credentialless, permissionPolicy, title) => {
+const create$v = async (uid, src, sandbox, csp, credentialless, permissionPolicy, title) => {
   const $Iframe = document.createElement('iframe');
   setIframeCredentialless($Iframe, credentialless);
   setIframeCsp($Iframe, csp);
@@ -6876,7 +6901,7 @@ const setPort$2 = (uid, port, origin, portType) => {
     params: [port, portType]
   }, origin, [port]);
 };
-const dispose$c = uid => {
+const dispose$b = uid => {
   const $Iframe = get(uid);
   $Iframe.remove();
   remove(uid);
@@ -6884,12 +6909,12 @@ const dispose$c = uid => {
 
 const name = 'WebView';
 const Commands$1 = {
-  create: create$w,
+  create: create$v,
   load: load,
   loadOnly: loadOnly,
   appendOnly: appendOnly,
   setPort: setPort$2,
-  dispose: dispose$c
+  dispose: dispose$b
 };
 
 const WebView_ipc = {
@@ -6931,10 +6956,10 @@ const handleMouseDown$2 = event => {
   const index = getNodeIndex($Item);
   return ['handleClick', button, index, clientX, clientY];
 };
-const handleBlur$8 = () => {
+const handleBlur$7 = () => {
   return ['handleBlur'];
 };
-const handleFocus$9 = () => {
+const handleFocus$8 = () => {
   return ['handleFocus'];
 };
 
@@ -6953,18 +6978,18 @@ const returnValue$5 = true;
 
 const ViewletActivityBarEvents = {
   __proto__: null,
-  handleBlur: handleBlur$8,
+  handleBlur: handleBlur$7,
   handleContextMenu: handleContextMenu$9,
-  handleFocus: handleFocus$9,
+  handleFocus: handleFocus$8,
   handleMouseDown: handleMouseDown$2,
   returnValue: returnValue$5
 };
 
-const Events$9 = ViewletActivityBarEvents;
+const Events$8 = ViewletActivityBarEvents;
 
 const ViewletActivityBar = {
   __proto__: null,
-  Events: Events$9
+  Events: Events$8
 };
 
 const handleAudioError = event => {
@@ -6987,14 +7012,14 @@ const ViewletAudioEvents = {
   handleAudioError
 };
 
-const Events$8 = ViewletAudioEvents;
+const Events$7 = ViewletAudioEvents;
 
 const ViewletAudio = {
   __proto__: null,
-  Events: Events$8
+  Events: Events$7
 };
 
-const create$v = () => {
+const create$u = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet BrowserViewOverview';
   return {
@@ -7010,18 +7035,18 @@ const setDom$5 = (state, dom) => {
 
 const ViewletBrowserViewOverview = {
   __proto__: null,
-  create: create$v,
+  create: create$u,
   setDom: setDom$5
 };
 
-const create$u = () => {
+const create$t = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Clock';
   return {
     $Viewlet
   };
 };
-const dispose$b = state => {};
+const dispose$a = state => {};
 const refresh$3 = () => {};
 const setTime = (state, time) => {
   object(state);
@@ -7031,8 +7056,8 @@ const setTime = (state, time) => {
 
 const ViewletClock = {
   __proto__: null,
-  create: create$u,
-  dispose: dispose$b,
+  create: create$t,
+  dispose: dispose$a,
   refresh: refresh$3,
   setTime
 };
@@ -7047,18 +7072,18 @@ const handleInput$4 = event => {
   } = target;
   handleInput$7(uid, value);
 };
-const handleFocus$8 = event => {
+const handleFocus$7 = event => {
   const uid = fromEvent(event);
-  handleFocus$b(uid);
+  handleFocus$a(uid);
 };
 
 const ViewletDebugConsoleEvents = {
   __proto__: null,
-  handleFocus: handleFocus$8,
+  handleFocus: handleFocus$7,
   handleInput: handleInput$4
 };
 
-const create$t = () => {
+const create$s = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet DebugConsole';
   return {
@@ -7074,7 +7099,7 @@ const setDom$4 = (state, dom) => {
 
 const ViewletDebugConsole = {
   __proto__: null,
-  create: create$t,
+  create: create$s,
   setDom: setDom$4
 };
 
@@ -7091,14 +7116,14 @@ const handleKeyDown$3 = event => {
   } = event;
   handleKeyDown$5(uid, key, altKey, ctrlKey, shiftKey, metaKey);
 };
-const handleBlur$7 = event => {
+const handleBlur$6 = event => {
   const uid = fromEvent(event);
-  handleBlur$b(uid);
+  handleBlur$a(uid);
 };
 
 const ViewletDefineKeyBindingEvents = {
   __proto__: null,
-  handleBlur: handleBlur$7,
+  handleBlur: handleBlur$6,
   handleKeyDown: handleKeyDown$3
 };
 
@@ -7135,7 +7160,7 @@ const setMaskImage = ($Element, icon) => {
   }
 };
 
-const create$s = icon => {
+const create$r = icon => {
   const $Icon = document.createElement('div');
   $Icon.className = 'MaskIcon';
   setMaskImage($Icon, icon);
@@ -7145,7 +7170,7 @@ const create$s = icon => {
 
 const create$Button = (label, icon) => {
   // TODO icon div might not be needed (unnecessary html element)
-  const $Icon = create$s(icon);
+  const $Icon = create$r(icon);
   const $Button = document.createElement('button');
   $Button.className = 'IconButton';
   $Button.title = label;
@@ -7154,19 +7179,19 @@ const create$Button = (label, icon) => {
   return $Button;
 };
 
-const handleClick$6 = index => {
+const handleClick$5 = index => {
   send(/* Dialog.handleClick */'Dialog.handleClick', /* index */index);
 };
 
-const handleClick$5 = event => {
+const handleClick$4 = event => {
   const {
     target
   } = event;
   const index = getNodeIndex(target);
-  handleClick$6(index);
+  handleClick$5(index);
 };
 
-const create$r = () => {
+const create$q = () => {
   const $DialogTitle = document.createElement('h2');
   $DialogTitle.id = 'DialogTitle';
   const $DialogCloseButton = create$Button('Close', 'Close');
@@ -7193,7 +7218,7 @@ const create$r = () => {
   $Dialog.setAttribute(AriaLabelledBy, 'DialogTitle');
   $Dialog.setAttribute(AriaDescribedBy, 'DialogBodyErrorMessage');
   $Dialog.append($DialogHeader, $DialogBody);
-  $Dialog.onclick = handleClick$5;
+  $Dialog.onclick = handleClick$4;
   return {
     $Viewlet: $Dialog,
     $DialogTitle,
@@ -7247,7 +7272,7 @@ const setErrorStack = (state, errorStack) => {
 
 const ViewletDialog = {
   __proto__: null,
-  create: create$r,
+  create: create$q,
   postAppend,
   setButtons,
   setCodeFrame,
@@ -7294,7 +7319,7 @@ const ViewletDiffEditor = {
 
 // TODO aria alert
 
-const create$q = () => {
+const create$p = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorError';
   return {
@@ -7316,7 +7341,7 @@ const setBounds$1 = (state, x, y, width, height) => {
 
 const ViewletEditorError = {
   __proto__: null,
-  create: create$q,
+  create: create$p,
   setBounds: setBounds$1,
   setDom: setDom$3
 };
@@ -7364,7 +7389,7 @@ const handlePointerCaptureLost$1 = event => {
 /**
  * @param {PointerEvent} event
  */
-const handlePointerDown$5 = event => {
+const handlePointerDown$4 = event => {
   const {
     pointerId,
     clientX,
@@ -7380,7 +7405,7 @@ const handlePointerDown$5 = event => {
   target.addEventListener(PointerUp, handlePointerUp);
   target.addEventListener(LostPointerCapture, handlePointerCaptureLost$1);
   const uid = fromEvent(event);
-  handlePointerDown$6(uid, pointerId, clientX, clientY);
+  handlePointerDown$5(uid, pointerId, clientX, clientY);
 };
 
 /**
@@ -7411,16 +7436,16 @@ const handleContextMenu$8 = event => {
   const uid = fromEvent(event);
   handleContextMenu$b(uid, button, clientX, clientY);
 };
-const handleError$5 = event => {
+const handleError$4 = event => {
   const uid = fromEvent(event);
   handleImageError$1(uid);
 };
-const handleFocus$7 = event => {
+const handleFocus$6 = event => {
   const uid = fromEvent(event);
-  handleFocus$b(uid);
+  handleFocus$a(uid);
 };
 
-const create$p = () => {
+const create$o = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorImage';
   return {
@@ -7432,12 +7457,12 @@ const attachEvents$8 = state => {
     $Viewlet
   } = state;
   attachEvents$c($Viewlet, {
-    [PointerDown]: handlePointerDown$5,
+    [PointerDown]: handlePointerDown$4,
     [PointerUp]: handlePointerUp,
     [ContextMenu]: handleContextMenu$8,
-    [FocusIn]: handleFocus$7
+    [FocusIn]: handleFocus$6
   });
-  $Viewlet.addEventListener(Error$3, handleError$5, Capture);
+  $Viewlet.addEventListener(Error$3, handleError$4, Capture);
   $Viewlet.addEventListener(Wheel, handleWheel$1, Passive);
 };
 const setTransform = (state, transform) => {
@@ -7463,13 +7488,13 @@ const setDom$2 = (state, dom) => {
 const ViewletEditorImage = {
   __proto__: null,
   attachEvents: attachEvents$8,
-  create: create$p,
+  create: create$o,
   setDom: setDom$2,
   setDragging,
   setTransform
 };
 
-const create$o = () => {
+const create$n = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorText';
   $Viewlet.textContent = 'loading...';
@@ -7477,7 +7502,7 @@ const create$o = () => {
     $Viewlet
   };
 };
-const dispose$a = state => {};
+const dispose$9 = state => {};
 const refresh$2 = (state, context) => {
   object(state);
   string(context.content);
@@ -7486,8 +7511,8 @@ const refresh$2 = (state, context) => {
 
 const ViewletEditorPlainText = {
   __proto__: null,
-  create: create$o,
-  dispose: dispose$a,
+  create: create$n,
+  dispose: dispose$9,
   refresh: refresh$2
 };
 
@@ -7550,10 +7575,10 @@ const attachEventsFunctional = ($Node, eventMap) => {
   }
 };
 
-const Text$1 = 'text';
+const Text = 'text';
 
 const getText = clipBoardData => {
-  return clipBoardData.getData(Text$1);
+  return clipBoardData.getData(Text);
 };
 
 const detachEvent = ($Node, key, listener) => {
@@ -7605,7 +7630,7 @@ const toSimpleTouchEvent = event => {
 
 // TODO tree shake out mobile support when targeting electron -> less code -> less event listeners -> less memory -> less cpu
 
-const handleFocus$6 = event => {
+const handleFocus$5 = event => {
   return ['handleFocus'];
 };
 const handleMouseMove = event => {
@@ -7616,7 +7641,7 @@ const handleMouseMove = event => {
   } = event;
   return ['handleMouseMove', clientX, clientY, altKey];
 };
-const handleBlur$6 = event => {
+const handleBlur$5 = event => {
   // needed for save on blur
   // also needed to close completions on blur
   return ['handleBlur'];
@@ -7745,7 +7770,7 @@ const handlePaste = event => {
   const text = getText(clipboardData);
   return ['paste', text];
 };
-const handleScrollBarVerticalPointerDown = create$K(event => {
+const handleScrollBarVerticalPointerDown = create$J(event => {
   const {
     clientY
   } = event;
@@ -7868,7 +7893,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$n = () => {
+const create$m = () => {
   const $EditorInput = document.createElement('textarea');
   $EditorInput.className = 'EditorInput';
   $EditorInput.ariaAutoComplete = List;
@@ -7886,8 +7911,8 @@ const create$n = () => {
     [CompositionStart]: handleCompositionStart,
     [CompositionUpdate]: handleCompositionUpdate,
     [CompositionEnd]: handleCompositionEnd,
-    [Focus]: handleFocus$6,
-    [Blur]: handleBlur$6,
+    [Focus]: handleFocus$5,
+    [Blur]: handleBlur$5,
     [Cut]: handleCut,
     [Paste]: handlePaste,
     returnValue: true
@@ -8035,11 +8060,11 @@ const setDecorationsDom$1 = (state, decorations) => {
   setDecorationsDom$2(state, decorations);
 };
 
-const create$m = create$n;
+const create$l = create$m;
 const setText$1 = setText$2;
 const setSelections = setSelections$1;
 const setIncrementalEdits = setIncrementalEdits$1;
-const handleError$4 = (state, error) => {
+const handleError$3 = (state, error) => {
   state.$Viewlet.textContent = error;
 };
 const setScrollBar = setScrollBar$1;
@@ -8077,9 +8102,9 @@ const setDecorationsDom = setDecorationsDom$1;
 
 const ViewletEditorText = {
   __proto__: null,
-  create: create$m,
+  create: create$l,
   focus: focus$d,
-  handleError: handleError$4,
+  handleError: handleError$3,
   hideOverlayMessage,
   highlightAsLink,
   renderGutter,
@@ -8093,7 +8118,7 @@ const ViewletEditorText = {
   showOverlayMessage
 };
 
-const create$l = () => {
+const create$k = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorWidgetError EditorOverlayMessage';
   return {
@@ -8116,12 +8141,12 @@ const setBounds = (state, x, y, width, height) => {
 
 const ViewletEditorWidgetError = {
   __proto__: null,
-  create: create$l,
+  create: create$k,
   setBounds,
   setMessage: setMessage$3
 };
 
-const create$k = () => {
+const create$j = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.dataset.viewlet = 'Empty';
   $Viewlet.className = 'Viewlet';
@@ -8131,17 +8156,17 @@ const create$k = () => {
 };
 const refresh$1 = (state, context) => {};
 const focus$c = state => {};
-const dispose$9 = state => {};
+const dispose$8 = state => {};
 
 const ViewletEmpty = {
   __proto__: null,
-  create: create$k,
-  dispose: dispose$9,
+  create: create$j,
+  dispose: dispose$8,
   focus: focus$c,
   refresh: refresh$1
 };
 
-const create$j = () => {
+const create$i = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Error';
   return {
@@ -8157,10 +8182,12 @@ const setMessage$2 = (state, message) => {
 
 const ViewletError = {
   __proto__: null,
-  create: create$j,
+  create: create$i,
   setMessage: setMessage$2
 };
 
+const Polite = 'polite';
+
 const handleContextMenu$6 = event => {
   preventDefault(event);
   const {
@@ -8172,274 +8199,6 @@ const handleContextMenu$6 = event => {
   handleContextMenu$b(uid, button, clientX, clientY);
 };
 
-const CopyMove = 'copyMove';
-
-const Text = 'text';
-const ResourceUrls = 'resourceurls';
-
-const setEffectAllowed = (dataTransfer, effectAllowed) => {
-  object(dataTransfer);
-  string(effectAllowed);
-  dataTransfer.effectAllowed = effectAllowed;
-};
-const setFilePath = (dataTransfer, filePath, fileName) => {
-  dataTransfer.setData(ResourceUrls, JSON.stringify([filePath]));
-  dataTransfer.setData(Text, filePath);
-  const dragImage = document.createElement('div');
-  dragImage.className = 'DragImage';
-  // if (Browser.getBrowser() !== 'chromium') {
-  //   // chrome doesn't support border radius
-  //   dragImage.style.borderRadius = '100px'
-  // }
-  dragImage.textContent = fileName;
-  document.body.append(dragImage);
-  dataTransfer.setDragImage(dragImage, -10, -10);
-  const handleTimeOut = () => {
-    dragImage.remove();
-  };
-  setTimeout(handleTimeOut, 0);
-};
-const getFilePaths = dataTransfer => {
-  const data = dataTransfer.getData(ResourceUrls);
-  if (data) {
-    const parsed = JSON.parse(data);
-    if (Array.isArray(parsed) && data.length > 0) {
-      return parsed;
-    }
-  }
-  return [];
-};
-const getFilePath = dataTransfer => {
-  const filePaths = getFilePaths(dataTransfer);
-  if (filePaths.length === 0) {
-    return '';
-  }
-  return filePaths[0];
-};
-
-const handleDragStart$1 = event => {
-  const {
-    dataTransfer,
-    target
-  } = event;
-  // @ts-ignore
-  setEffectAllowed(dataTransfer, CopyMove);
-
-  // @ts-ignore
-  if (target.classList.contains('TreeItem')) {
-    // @ts-ignore
-    const filePath = target.title;
-    // @ts-ignore
-    const fileName = target.textContent;
-    setFilePath(dataTransfer, filePath, fileName);
-  }
-};
-const handleDragOver$1 = event => {
-  preventDefault(event);
-  const {
-    clientX,
-    clientY
-  } = event;
-  const uid = fromEvent(event);
-  handleDragOver$2(uid, clientX, clientY);
-};
-const handleDragEnd = event => {
-  const {
-    clientX,
-    clientY
-  } = event;
-  const uid = fromEvent(event);
-  handleDragEnd$1(uid, clientX, clientY);
-};
-const handleDragLeave = event => {
-  const {
-    clientX,
-    clientY
-  } = event;
-  const uid = fromEvent(event);
-  handleDragLeave$1(uid, clientX, clientY);
-};
-
-/**
- *
- * @param {DragEvent} event
- */
-const handleDrop$1 = event => {
-  preventDefault(event);
-  const {
-    dataTransfer,
-    clientX,
-    clientY
-  } = event;
-  const {
-    files
-  } = dataTransfer;
-  const uid = fromEvent(event);
-  if (files.length > 0) {
-    return handleDropFiles(uid, clientX, clientY, files);
-  }
-  const filePath = getFilePath(dataTransfer);
-  if (filePath) {
-    handleDropFilePath(uid, clientX, clientY, filePath);
-  }
-};
-
-// TODO put drop into separate module and use executeCommand to call it
-
-// TODO drag and drop should be loaded on demand
-
-const handleFocus$5 = event => {
-  const {
-    target,
-    isTrusted
-  } = event;
-  if (!isTrusted || target.className === 'InputBox') {
-    return;
-  }
-  const uid = fromEvent(event);
-  handleFocus$b(uid);
-};
-const handleBlur$5 = event => {
-  const uid = fromEvent(event);
-  handleBlur$b(uid);
-};
-const handleClick$4 = event => {
-  preventDefault(event);
-  const {
-    button,
-    clientX,
-    clientY
-  } = event;
-  const uid = fromEvent(event);
-  handleClickAt$3(uid, button, clientX, clientY);
-};
-const handleClickOpenFolder = event => {
-  preventDefault(event);
-  const uid = fromEvent(event);
-  handleClickOpenFolder$1(uid);
-};
-const handlePointerDown$4 = event => {
-  const {
-    button,
-    clientX,
-    clientY
-  } = event;
-  const uid = fromEvent(event);
-  handlePointerDown$6(uid, button, clientX, clientY);
-};
-const handleMouseEnter = event => {
-  // const $Target = event.target
-  // const index = findIndex($Target)
-  // if (index === -1) {
-  //   return
-  // }
-  // RendererWorker.send(
-  //   /* Explorer.handleMouseEnter */ 'Explorer.handleMouseEnter',
-  //   /* index */ index
-  // )
-};
-const handleMouseLeave = event => {
-  // const $Target = event.target
-  // const index = findIndex($Target)
-  // if (index === -1) {
-  //   return
-  // }
-  // RendererWorker.send(
-  //   /* Explorer.handleMouseLeave */ 'Explorer.handleMouseLeave',
-  //   /* index */ index
-  // )
-};
-const handleEditingInput = event => {
-  const {
-    target
-  } = event;
-  const {
-    value
-  } = target;
-  const uid = fromEvent(event);
-  updateEditingValue(uid, value);
-};
-
-const ViewletExplorerEvents = {
-  __proto__: null,
-  handleBlur: handleBlur$5,
-  handleClick: handleClick$4,
-  handleClickOpenFolder,
-  handleContextMenu: handleContextMenu$6,
-  handleDragEnd,
-  handleDragLeave,
-  handleDragOver: handleDragOver$1,
-  handleDragStart: handleDragStart$1,
-  handleDrop: handleDrop$1,
-  handleEditingInput,
-  handleFocus: handleFocus$5,
-  handleMouseEnter,
-  handleMouseLeave,
-  handlePointerDown: handlePointerDown$4,
-  handleWheel: handleWheel$2
-};
-
-const create$i = () => {
-  const $Viewlet = document.createElement('div');
-  $Viewlet.className = 'Viewlet Explorer';
-  $Viewlet.tabIndex = 0;
-  $Viewlet.role = Tree;
-  $Viewlet.ariaLabel = 'Files Explorer';
-  return {
-    $Viewlet
-  };
-};
-const Events$7 = ViewletExplorerEvents;
-const handleError$3 = (state, message) => {
-  object(state);
-  string(message);
-  const {
-    $Viewlet
-  } = state;
-  $Viewlet.textContent = message;
-};
-const focusInput = (state, id) => {
-  const $Input = document.getElementById(id);
-  if (!$Input) {
-    return;
-  }
-  $Input.focus();
-  send('Focus.setFocus', FocusExplorerEditBox);
-};
-const dispose$8 = state => {};
-const setDropTargets = (state, oldDropTargets, newDropTargets) => {
-  // TODO use virtual dom for this
-  const {
-    $Viewlet
-  } = state;
-  for (const oldIndex of oldDropTargets) {
-    if (oldIndex === -1) {
-      $Viewlet.classList.remove('DropTarget');
-    } else {
-      $Viewlet.children[oldIndex].classList.remove('DropTarget');
-    }
-  }
-  for (const newIndex of newDropTargets) {
-    if (newIndex === -1) {
-      $Viewlet.classList.add('DropTarget');
-    } else {
-      $Viewlet.children[newIndex].classList.add('DropTarget');
-    }
-  }
-};
-
-const ViewletExplorer = {
-  __proto__: null,
-  Events: Events$7,
-  create: create$i,
-  dispose: dispose$8,
-  focusInput,
-  handleError: handleError$3,
-  setDropTargets
-};
-
-const Polite = 'polite';
-
 const handleScrollBarThumbPointerMove = event => {
   const {
     clientY
@@ -8468,7 +8227,7 @@ const handleScrollBarPointerDown$1 = event => {
 };
 const handleFocus$4 = event => {
   const uid = fromEvent(event);
-  handleFocus$b(uid);
+  handleFocus$a(uid);
 };
 const handlePointerDown$3 = event => {
   const {
@@ -8481,7 +8240,7 @@ const handlePointerDown$3 = event => {
   }
   const $Extension = target.closest('.ExtensionListItem');
   const index = getNodeIndex($Extension);
-  handleClick$7(uid, index);
+  handleClick$6(uid, index);
 };
 const handleInput$3 = event => {
   const $Target = event.target;
@@ -9388,6 +9147,83 @@ const ViewletLayout = {
   setSashes
 };
 
+const CopyMove = 'copyMove';
+
+const ResourceUrls = 'resourceurls';
+
+const setEffectAllowed = (dataTransfer, effectAllowed) => {
+  object(dataTransfer);
+  string(effectAllowed);
+  dataTransfer.effectAllowed = effectAllowed;
+};
+const getFilePaths = dataTransfer => {
+  const data = dataTransfer.getData(ResourceUrls);
+  if (data) {
+    const parsed = JSON.parse(data);
+    if (Array.isArray(parsed) && data.length > 0) {
+      return parsed;
+    }
+  }
+  return [];
+};
+const getFilePath = dataTransfer => {
+  const filePaths = getFilePaths(dataTransfer);
+  if (filePaths.length === 0) {
+    return '';
+  }
+  return filePaths[0];
+};
+
+const handleDragOver$1 = event => {
+  preventDefault(event);
+  const {
+    clientX,
+    clientY
+  } = event;
+  const uid = fromEvent(event);
+  handleDragOver$2(uid, clientX, clientY);
+};
+const handleDragEnd = event => {
+  const {
+    clientX,
+    clientY
+  } = event;
+  const uid = fromEvent(event);
+  handleDragEnd$1(uid, clientX, clientY);
+};
+const handleDragLeave = event => {
+  const {
+    clientX,
+    clientY
+  } = event;
+  const uid = fromEvent(event);
+  handleDragLeave$1(uid, clientX, clientY);
+};
+
+/**
+ *
+ * @param {DragEvent} event
+ */
+const handleDrop$1 = event => {
+  preventDefault(event);
+  const {
+    dataTransfer,
+    clientX,
+    clientY
+  } = event;
+  const {
+    files
+  } = dataTransfer;
+  const uid = fromEvent(event);
+  if (files.length > 0) {
+    return handleDropFiles(uid, clientX, clientY, files);
+  }
+  const filePath = getFilePath(dataTransfer);
+  if (filePath) {
+    handleDropFilePath(uid, clientX, clientY, filePath);
+  }
+};
+
 const handleContextMenu$5 = event => {
   if (event.defaultPrevented) {
     return;
@@ -9987,7 +9823,7 @@ const handlePointerDown = event => {
 };
 const handleBlur$2 = event => {
   const uid = fromEvent(event);
-  handleBlur$b(uid);
+  handleBlur$a(uid);
 };
 
 // TODO
@@ -10551,7 +10387,7 @@ const ViewletSimpleBrowser = {
 
 const handleFocus = event => {
   const uid = fromEvent(event);
-  handleFocus$b(uid);
+  handleFocus$a(uid);
 };
 const getButtonIndex = $Node => {
   let index = -1;
@@ -10582,7 +10418,7 @@ const handleClick$3 = event => {
   if (index === -1) {
     return;
   }
-  handleClick$7(uid, index);
+  handleClick$6(uid, index);
 };
 const handleMouseOver = event => {
   const {
@@ -10654,7 +10490,7 @@ const handleClick$2 = event => {
     clientX,
     clientY
   } = event;
-  handleClick$7(uid, clientX, clientY);
+  handleClick$6(uid, clientX, clientY);
 };
 
 const ViewletStatusBarEvents = {
@@ -10698,7 +10534,7 @@ const ViewletStatusBar = {
 
 const handleClick$1 = event => {
   const uid = fromEvent(event);
-  handleClick$7(uid);
+  handleClick$6(uid);
 };
 
 const ViewletStorageEvents = {
@@ -10804,7 +10640,7 @@ const create$6 = ({
 
 const handleBlur = event => {
   const uid = fromEvent(event);
-  handleBlur$b(uid);
+  handleBlur$a(uid);
 };
 const handleMouseDown = (event, ...args) => {
   const uid = fromEvent(event);
@@ -11081,7 +10917,7 @@ const handleClick = event => {
   } = event;
   const index = getIndex(target);
   const uid = fromEvent(event);
-  handleClick$7(uid, button, index);
+  handleClick$6(uid, button, index);
 };
 const getLevelAndIndex = event => {
   const {
@@ -11117,7 +10953,7 @@ const handleMenuClick = event => {
 };
 const handleFocusIn = event => {
   const uid = fromEvent(event);
-  handleFocus$b(uid);
+  handleFocus$a(uid);
 };
 
 const ViewletTitleBarMenuBarEvents = {
@@ -11562,7 +11398,7 @@ const handleContextMenu$1 = event => {
   } = event;
   return ['handleContextMenu', button, clientX, clientY];
 };
-const handleSashCornerPointerDown = create$K(event => {
+const handleSashCornerPointerDown = create$J(event => {
   const {
     clientX,
     clientY