@lvce-editor/renderer-process 21.19.0 → 22.0.0

package/dist/rendererProcessMain.js

@@ -10,7 +10,7 @@ class AssertionError extends Error {
   }
 }
 const Object$1 = 1;
-const Number$1 = 2;
+const Number = 2;
 const Array$1 = 3;
 const String$1 = 4;
 const Boolean$1 = 5;
@@ -20,7 +20,7 @@ const Unknown$1 = 8;
 const getType = value => {
   switch (typeof value) {
     case 'number':
-      return Number$1;
+      return Number;
     case 'function':
       return Function;
     case 'string':
@@ -47,7 +47,7 @@ const object = value => {
 };
 const number = value => {
   const type = getType(value);
-  if (type !== Number$1) {
+  if (type !== Number) {
     throw new AssertionError('expected value to be of type number');
   }
 };
@@ -63,12 +63,6 @@ const string = value => {
     throw new AssertionError('expected value to be of type string');
   }
 };
-const boolean = value => {
-  const type = getType(value);
-  if (type !== Boolean$1) {
-    throw new AssertionError('expected value to be of type boolean');
-  }
-};
 
 const readText = async () => {
   return navigator.clipboard.readText();
@@ -572,6 +566,21 @@ const attachEvent$1 = ($Node, eventMap, key, value, newEventMap) => {
   const wrapped = getWrappedListener$1(listener, eventMap.returnValue);
   $Node.addEventListener(keyLower, wrapped, options);
 };
+const STYLE_REGEX = /([^:;]+):\s*([^;]+)/g;
+const KEBAB_CASE_REGEX = /-([a-z])/g;
+const setStyle = ($Element, styleString) => {
+  if (typeof styleString !== 'string') {
+    return;
+  }
+  let match;
+  while ((match = STYLE_REGEX.exec(styleString)) !== null) {
+    const key = match[1].trim();
+    const value = match[2].trim();
+    // Convert kebab-case to camelCase for CSS properties with dashes
+    const camelCaseKey = key.replaceAll(KEBAB_CASE_REGEX, (_, char) => char.toUpperCase());
+    $Element.style[camelCaseKey] = value;
+  }
+};
 const setProp = ($Element, key, value, eventMap, newEventMap) => {
   switch (key) {
     case 'ariaActivedescendant':
@@ -595,6 +604,9 @@ const setProp = ($Element, key, value, eventMap, newEventMap) => {
         $Element.removeAttribute('aria-owns');
       }
       break;
+    case 'childCount':
+    case 'type':
+      break;
     case 'height':
     case 'width':
       if ($Element instanceof HTMLImageElement) {
@@ -642,8 +654,11 @@ const setProp = ($Element, key, value, eventMap, newEventMap) => {
     case 'onFocusIn':
     case 'onFocusOut':
     case 'onInput':
+    case 'onKeydown':
     case 'onKeyDown':
+    case 'onKeyUp':
     case 'onMouseDown':
+    case 'onMouseMove':
     case 'onMouseOut':
     case 'onMouseOver':
     case 'onPointerDown':
@@ -660,9 +675,7 @@ const setProp = ($Element, key, value, eventMap, newEventMap) => {
       attachEvent$1($Element, eventMap, eventName, value, newEventMap);
       break;
     case 'style':
-      throw new Error('style property is not supported');
-    case 'childCount':
-    case 'type':
+      setStyle($Element, value);
       break;
     case 'translate':
       $Element.style[key] = value;
@@ -844,7 +857,7 @@ const enabled = () => {
   return ignore;
 };
 let id$1 = 0;
-const create$G = () => {
+const create$D = () => {
   return ++id$1;
 };
 const state$8 = Object.create(null);
@@ -859,7 +872,7 @@ const getFileHandles$1 = async ids => {
   return handles;
 };
 const add = promise => {
-  const id = create$G();
+  const id = create$D();
   state$8[id] = promise;
   return id;
 };
@@ -1505,7 +1518,7 @@ const getWorkerDisplayName$1 = name => {
   }
   return `${name} worker`;
 };
-const create$F = async ({
+const create$C = async ({
   name,
   url
 }) => {
@@ -1572,7 +1585,7 @@ const wrap = worker => {
 
 const IpcParentWithModuleWorker$2 = {
   __proto__: null,
-  create: create$F,
+  create: create$C,
   wrap
 };
 
@@ -1580,7 +1593,7 @@ const isMessagePort$1 = value => {
   return value instanceof MessagePort;
 };
 
-const create$E = async ({
+const create$B = async ({
   url
 }) => {
   string(url);
@@ -1601,10 +1614,10 @@ const create$E = async ({
 
 const IpcParentWithMessagePort$2 = {
   __proto__: null,
-  create: create$E
+  create: create$B
 };
 
-const create$D = async url => {
+const create$A = async url => {
   const referencePort = await new Promise(resolve => {
     globalThis.acceptReferencePort = resolve;
     import(url);
@@ -1615,7 +1628,7 @@ const create$D = async url => {
 
 const IpcParentWithReferencePort = {
   __proto__: null,
-  create: create$D
+  create: create$A
 };
 
 const normalizeLine = line => {
@@ -1760,7 +1773,7 @@ const fixElectronParameters = value => {
     transfer
   };
 };
-const attachEvents$9 = that => {
+const attachEvents$7 = that => {
   const handleMessage = (...args) => {
     const data = that.getData(...args);
     that.dispatchEvent(new MessageEvent('message', {
@@ -1777,7 +1790,7 @@ class Ipc extends EventTarget {
   constructor(rawIpc) {
     super();
     this._rawIpc = rawIpc;
-    attachEvents$9(this);
+    attachEvents$7(this);
   }
 }
 const E_INCOMPATIBLE_NATIVE_MODULE = 'E_INCOMPATIBLE_NATIVE_MODULE';
@@ -2384,7 +2397,7 @@ const getErrorResponse = (id, error, preparePrettyError, logError) => {
   const errorProperty = getErrorProperty(error, prettyError);
   return create$1$1(id, errorProperty);
 };
-const create$C = (message, result) => {
+const create$z = (message, result) => {
   return {
     jsonrpc: Two$1,
     id: message.id,
@@ -2393,7 +2406,7 @@ const create$C = (message, result) => {
 };
 const getSuccessResponse = (message, result) => {
   const resultProperty = result ?? null;
-  return create$C(message, resultProperty);
+  return create$z(message, resultProperty);
 };
 const getErrorResponseSimple = (id, error) => {
   return {
@@ -2720,7 +2733,7 @@ const PlainMessagePortRpcParent = {
 };
 
 // TODO add test
-const create$B = async ({
+const create$y = async ({
   name,
   port,
   url
@@ -2736,7 +2749,7 @@ const create$B = async ({
 
 const IpcParentWithModuleWorkerWithMessagePort = {
   __proto__: null,
-  create: create$B
+  create: create$y
 };
 
 const Web = 1;
@@ -2769,7 +2782,7 @@ const platform = getPlatform();
 const isElectron = platform === Electron;
 
 // TODO use handleIncomingIpc function
-const create$A = async ({
+const create$x = async ({
   ipcId,
   port
 }) => {
@@ -2787,7 +2800,7 @@ const create$A = async ({
 
 const IpcParentWithElectron = {
   __proto__: null,
-  create: create$A
+  create: create$x
 };
 
 const getModule = method => {
@@ -2898,7 +2911,7 @@ const hydrate$3 = async () => {
 };
 
 // TODO needed?
-const dispose$j = () => {
+const dispose$h = () => {
   if (state$7.rpc) {
     // @ts-expect-error
     state$7.rpc.dispose();
@@ -2923,7 +2936,7 @@ const invokeAndTransfer = (method, ...params) => {
 
 const RendererWorker = {
   __proto__: null,
-  dispose: dispose$j,
+  dispose: dispose$h,
   hydrate: hydrate$3,
   invoke: invoke$1,
   invokeAndTransfer,
@@ -2932,7 +2945,7 @@ const RendererWorker = {
   state: state$7
 };
 
-const create$z = async ({
+const create$w = async ({
   method,
   ...options
 }) => {
@@ -3053,7 +3066,7 @@ const create$Notification = message => {
   $Notification.textContent = message;
   return $Notification;
 };
-const create$y = (type, message) => {
+const create$v = (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);
@@ -3098,7 +3111,7 @@ const createWithOptions = (type, message, options) => {
   const $Notification = create$NotificationWithOptions(message, options);
   append$1($Notification);
 };
-const dispose$i = id => {
+const dispose$g = id => {
   // const $Notification = state.$Notifications
 };
 
@@ -3115,7 +3128,7 @@ const set$6 = (canvasId, canvas) => {
 const get$4 = id => {
   return get$5(id);
 };
-const create$x = async (canvasId, objectId) => {
+const create$u = async (canvasId, objectId) => {
   const canvas = document.createElement('canvas');
   const offscreenCanvas = canvas.transferControlToOffscreen();
   set$6(canvasId, canvas);
@@ -3130,6 +3143,7 @@ const create2 = async (canvasId, objectId, width, height) => {
     canvas.height = height;
   }
   const offscreenCanvas = canvas.transferControlToOffscreen();
+  canvas.dataset.id = canvasId;
   set$1$1(canvasId, {
     factory: {},
     state: {
@@ -3149,7 +3163,6 @@ const Complementary = 'complementary';
 const Group = 'group';
 const ListBox = 'listbox';
 const Log = 'log';
-const Main$1 = 'main';
 const Menu = 'menu';
 const None$2 = 'none';
 const Status = 'status';
@@ -3179,11 +3192,6 @@ const CompositionUpdate = 'compositionupdate';
 const ContextMenu = 'contextmenu';
 const Cut = 'cut';
 const DoubleClick = 'dblclick';
-const DragEnd = 'dragend';
-const DragLeave = 'dragleave';
-const DragOver = 'dragover';
-const DragStart = 'dragstart';
-const Drop = 'drop';
 const Error$2 = 'error';
 const Focus = 'focus';
 const FocusIn = 'focusin';
@@ -3248,7 +3256,7 @@ const getElement = () => {
   return state$4.$PreviousFocusElement;
 };
 
-const focus$f = $Element => {
+const focus$d = $Element => {
   if ($Element === document.activeElement) {
     return;
   }
@@ -3417,10 +3425,10 @@ const handleMouseLeave = event => {
 const handleKeyDown$5 = event => {
   state$3.handleKeyDown(event);
 };
-const handleFocusOut$1 = event => {
+const handleFocusOut = event => {
   state$3.handleFocusOut(event);
 };
-const create$Menu$1 = () => {
+const create$Menu = () => {
   // TODO set aria label on menu (e.g. File, Edit, Selection)
   const $Menu = document.createElement('ul');
   $Menu.className = 'Menu';
@@ -3439,8 +3447,8 @@ const create$Menu$1 = () => {
   //   passive: true,
   // })
   $Menu.onkeydown = handleKeyDown$5;
-  $Menu.addEventListener(FocusOut, handleFocusOut$1);
-  $Menu.oncontextmenu = handleContextMenu$9;
+  $Menu.addEventListener(FocusOut, handleFocusOut);
+  $Menu.oncontextmenu = handleContextMenu$8;
   // $ContextMenu.onfocus = handleFocus
   // $ContextMenu.onblur = handleBlur
   return $Menu;
@@ -3469,19 +3477,19 @@ const handleBackDropMouseDown = event => {
   stopPropagation(event);
   send(/* Menu.hide */'Menu.hide');
 };
-const handleContextMenu$9 = event => {
+const handleContextMenu$8 = event => {
   preventDefault(event);
 };
 const showMenu = (x, y, width, height, items, level, parentIndex = -1, dom, mouseBlocking = false) => {
   if (mouseBlocking) {
     const $BackDrop = create$BackDrop();
     $BackDrop.onmousedown = handleBackDropMouseDown;
-    $BackDrop.oncontextmenu = handleContextMenu$9;
+    $BackDrop.oncontextmenu = handleContextMenu$8;
     // @ts-expect-error
     state$3.$BackDrop = $BackDrop;
     append$1($BackDrop);
   }
-  const $Menu = create$Menu$1();
+  const $Menu = create$Menu();
   renderInto($Menu, dom);
   setXAndY($Menu, x, y);
   $Menu.id = `Menu-${level}`;
@@ -3497,7 +3505,7 @@ const showMenu = (x, y, width, height, items, level, parentIndex = -1, dom, mous
   state$3.$$Menus.push($Menu);
   append$1($Menu);
   if (level === 0) {
-    focus$f($Menu);
+    focus$d($Menu);
     send('Focus.setFocus', FocusMenu);
   }
 };
@@ -4291,7 +4299,7 @@ const showError = (message, y, x) => {
     $ImagePreviewImage
   };
 };
-const create$w = (uri, top, left) => {
+const create$t = (uri, top, left) => {
   const $ImagePreviewImage = document.createElement('img');
   $ImagePreviewImage.className = 'ImagePreviewImage';
   $ImagePreviewImage.src = uri;
@@ -4316,14 +4324,14 @@ const create$w = (uri, top, left) => {
 const update = (state, uri) => {
   state.$ImagePreviewImage.uri = uri;
 };
-const dispose$h = state => {
+const dispose$f = state => {
   remove$1(state.$ImagePreview);
 };
 
 const ImagePreview$1 = {
   __proto__: null,
-  create: create$w,
-  dispose: dispose$h,
+  create: create$t,
+  dispose: dispose$f,
   showError,
   update
 };
@@ -4370,7 +4378,7 @@ const handleFocus$9 = () => {
 
 // TODO use context menu events function again
 
-const handleContextMenu$8 = event => {
+const handleContextMenu$7 = event => {
   preventDefault(event);
   const {
     button,
@@ -4379,22 +4387,22 @@ const handleContextMenu$8 = event => {
   } = event;
   return ['handleContextMenu', button, clientX, clientY];
 };
-const returnValue$8 = true;
+const returnValue$7 = true;
 
 const ViewletActivityBarEvents = {
   __proto__: null,
   handleBlur: handleBlur$9,
-  handleContextMenu: handleContextMenu$8,
+  handleContextMenu: handleContextMenu$7,
   handleFocus: handleFocus$9,
   handleMouseDown: handleMouseDown$3,
-  returnValue: returnValue$8
+  returnValue: returnValue$7
 };
 
-const Events$5 = ViewletActivityBarEvents;
+const Events$4 = ViewletActivityBarEvents;
 
 const ViewletActivityBar = {
   __proto__: null,
-  Events: Events$5
+  Events: Events$4
 };
 
 const executeViewletCommand = (uid, command, ...args) => {
@@ -4419,7 +4427,7 @@ const forwardViewletCommand = name => {
 forwardViewletCommand('clearFilter');
 forwardViewletCommand('close');
 forwardViewletCommand('closeEditor');
-const closeMenu$1 = forwardViewletCommand('closeMenu');
+forwardViewletCommand('closeMenu');
 forwardViewletCommand('compositionEnd');
 forwardViewletCommand('compositionStart');
 forwardViewletCommand('compositionUpdate');
@@ -4433,7 +4441,7 @@ forwardViewletCommand('handleBeforeInput');
 forwardViewletCommand('handleBeforeInputFromContentEditable');
 const handleBlur$8 = forwardViewletCommand('handleBlur');
 const handleButtonClick = forwardViewletCommand('handleButtonClick');
-const handleClick$6 = forwardViewletCommand('handleClick');
+const handleClick$5 = forwardViewletCommand('handleClick');
 const handleClickAction$2 = forwardViewletCommand('handleClickAction');
 forwardViewletCommand('handleClickAdd');
 const handleClickAt$3 = forwardViewletCommand('handleClickAt');
@@ -4446,29 +4454,29 @@ forwardViewletCommand('handleClickOpenFolder');
 forwardViewletCommand('handleClickRestore');
 const handleClickTab$2 = forwardViewletCommand('handleClickTab');
 forwardViewletCommand('handleClickToggleMaximize');
-const handleContextMenu$7 = forwardViewletCommand('handleContextMenu');
+const handleContextMenu$6 = forwardViewletCommand('handleContextMenu');
 forwardViewletCommand('handleDoubleClick');
-const handleDragEnd$1 = forwardViewletCommand('handleDragEnd');
-const handleDragLeave$1 = forwardViewletCommand('handleDragLeave');
-const handleDragOver$2 = forwardViewletCommand('handleDragOver');
+forwardViewletCommand('handleDragEnd');
+forwardViewletCommand('handleDragLeave');
+forwardViewletCommand('handleDragOver');
+forwardViewletCommand('handleDrop');
+forwardViewletCommand('handleDropFilePath');
 forwardViewletCommand('handleDrop');
-const handleDropFilePath = forwardViewletCommand('handleDropFilePath');
-const handleDropFiles = forwardViewletCommand('handleDrop');
 forwardViewletCommand('handleFeaturesClick');
 forwardViewletCommand('handleClickSize');
 forwardViewletCommand('handleClickDisable');
 forwardViewletCommand('handleClickUninstall');
 forwardViewletCommand('handleFilterInput');
 const handleFocus$8 = forwardViewletCommand('handleFocus');
-const handleFocusIn$4 = forwardViewletCommand('handleFocusIn');
+const handleFocusIn$3 = forwardViewletCommand('handleFocusIn');
 forwardViewletCommand('handleIconError');
 const handleImageError = forwardViewletCommand('handleImageError');
 const handleInput$6 = forwardViewletCommand('handleInput');
 const handleKeyDown$4 = forwardViewletCommand('handleKeyDown');
 forwardViewletCommand('handleListBlur');
 forwardViewletCommand('handleListFocus');
-const handleMenuClick$1 = forwardViewletCommand('handleMenuClick');
-const handleMenuMouseOver$1 = forwardViewletCommand('handleMenuMouseOver');
+forwardViewletCommand('handleMenuClick');
+forwardViewletCommand('handleMenuMouseOver');
 const handleMouseDown$2 = forwardViewletCommand('handleMouseDown');
 forwardViewletCommand('handleMouseMove');
 const handleMouseOut$1 = forwardViewletCommand('handleMouseOut');
@@ -4492,14 +4500,14 @@ forwardViewletCommand('handleScrollBarMove');
 forwardViewletCommand('handleScrollBarVerticalPointerDown');
 forwardViewletCommand('handleSliderPointerDown');
 forwardViewletCommand('handleSliderPointerMove');
-const handleTabClick = forwardViewletCommand('handleTabClick');
-const handleTabContextMenu = forwardViewletCommand('handleTabContextMenu');
-const handleTabDrop = forwardViewletCommand('handleTabDrop');
+forwardViewletCommand('handleTabClick');
+forwardViewletCommand('handleTabContextMenu');
+forwardViewletCommand('handleTabDrop');
 forwardViewletCommand('handleTabsClick');
-const handleTabsDragOver = forwardViewletCommand('handleTabsDragOver');
+forwardViewletCommand('handleTabsDragOver');
 forwardViewletCommand('handleTabsPointerOut');
 forwardViewletCommand('handleTabsPointerOver');
-const handleTabsWheel$1 = forwardViewletCommand('handleTabsWheel');
+forwardViewletCommand('handleTabsWheel');
 forwardViewletCommand('handleTouchEnd');
 forwardViewletCommand('handleTouchMove');
 forwardViewletCommand('handleTouchStart');
@@ -4540,21 +4548,21 @@ const ViewletAudioEvents = {
   handleAudioError
 };
 
-const Events$4 = ViewletAudioEvents;
+const Events$3 = ViewletAudioEvents;
 
 const ViewletAudio = {
   __proto__: null,
-  Events: Events$4
+  Events: Events$3
 };
 
-const create$v = () => {
+const create$s = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Clock';
   return {
     $Viewlet
   };
 };
-const dispose$g = state => {};
+const dispose$e = state => {};
 const refresh$4 = () => {};
 const setTime = (state, time) => {
   object(state);
@@ -4564,8 +4572,8 @@ const setTime = (state, time) => {
 
 const ViewletClock = {
   __proto__: null,
-  create: create$v,
-  dispose: dispose$g,
+  create: create$s,
+  dispose: dispose$e,
   refresh: refresh$4,
   setTime
 };
@@ -4593,7 +4601,7 @@ const stopTracking$1 = ($Target, pointerId, handlePointerMove, handlePointerUp)
   // TODO use pointerlost event instead
   $Target.removeEventListener(PointerUp, handlePointerUp);
 };
-const create$u = (pointerDown, pointerMove, pointerUp) => {
+const create$r = (pointerDown, pointerMove, pointerUp) => {
   const shared = (fn, event) => {
     const message = fn(event);
     if (!message || message.length === 0) {
@@ -4626,7 +4634,7 @@ const create$u = (pointerDown, pointerMove, pointerUp) => {
 };
 
 const handleOffset = 20;
-const handleSliderPointerDown = create$u(event => {
+const handleSliderPointerDown = create$r(event => {
   const {
     clientX,
     clientY
@@ -4650,12 +4658,12 @@ const handlePointerDown$2 = event => {
   }
   return [];
 };
-const returnValue$7 = true;
+const returnValue$6 = true;
 
 const ViewletColorPickerEvents = {
   __proto__: null,
   handlePointerDown: handlePointerDown$2,
-  returnValue: returnValue$7
+  returnValue: returnValue$6
 };
 
 const setColor = (state, color) => {
@@ -4708,14 +4716,14 @@ const ViewletDebugConsoleEvents = {
   handleInput: handleInput$5
 };
 
-const create$t = () => {
+const create$q = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet DebugConsole';
   return {
     $Viewlet
   };
 };
-const setDom$9 = (state, dom) => {
+const setDom$8 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -4724,8 +4732,8 @@ const setDom$9 = (state, dom) => {
 
 const ViewletDebugConsole = {
   __proto__: null,
-  create: create$t,
-  setDom: setDom$9
+  create: create$q,
+  setDom: setDom$8
 };
 
 const handleKeyDown$3 = event => {
@@ -4761,7 +4769,7 @@ const setValue$2 = (state, value) => {
   const $Input = $Viewlet.querySelector('input');
   $Input.value = value;
 };
-const focus$e = state => {
+const focus$c = state => {
   const {
     $Viewlet
   } = state;
@@ -4772,7 +4780,7 @@ const focus$e = state => {
 const ViewletDefineKeyBinding = {
   __proto__: null,
   Events: ViewletDefineKeyBindingEvents,
-  focus: focus$e,
+  focus: focus$c,
   setValue: setValue$2
 };
 
@@ -4785,7 +4793,7 @@ const setMaskImage = ($Element, icon) => {
   }
 };
 
-const create$s = icon => {
+const create$p = icon => {
   const $Icon = document.createElement('div');
   $Icon.className = 'MaskIcon';
   setMaskImage($Icon, icon);
@@ -4795,7 +4803,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$p(icon);
   const $Button = document.createElement('button');
   $Button.className = 'IconButton';
   $Button.title = label;
@@ -4804,19 +4812,19 @@ const create$Button = (label, icon) => {
   return $Button;
 };
 
-const handleClick$5 = index => {
+const handleClick$4 = index => {
   send(/* Dialog.handleClick */'Dialog.handleClick', /* index */index);
 };
 
-const handleClick$4 = event => {
+const handleClick$3 = event => {
   const {
     target
   } = event;
   const index = getNodeIndex(target);
-  handleClick$5(index);
+  handleClick$4(index);
 };
 
-const create$r = () => {
+const create$o = () => {
   const $DialogTitle = document.createElement('h2');
   $DialogTitle.id = 'DialogTitle';
   const $DialogCloseButton = create$Button('Close', 'Close');
@@ -4843,7 +4851,7 @@ const create$r = () => {
   $Dialog.setAttribute(AriaLabelledBy, 'DialogTitle');
   $Dialog.setAttribute(AriaDescribedBy, 'DialogBodyErrorMessage');
   $Dialog.append($DialogHeader, $DialogBody);
-  $Dialog.onclick = handleClick$4;
+  $Dialog.onclick = handleClick$3;
   return {
     $DialogBodyErrorCodeFrame,
     $DialogBodyErrorMessage,
@@ -4897,7 +4905,7 @@ const setErrorStack = (state, errorStack) => {
 
 const ViewletDialog = {
   __proto__: null,
-  create: create$r,
+  create: create$o,
   postAppend,
   setButtons,
   setCodeFrame,
@@ -4951,7 +4959,7 @@ const handleClickAt$2 = event => {
 const handleLoad$3 = event => {
   return ['handleLoad'];
 };
-const handleContextMenu$6 = event => {
+const handleContextMenu$5 = event => {
   preventDefault(event);
   const {
     button,
@@ -4960,7 +4968,7 @@ const handleContextMenu$6 = event => {
   } = event;
   return ['handleContextMenu', button, clientX, clientY];
 };
-const handleSashCornerPointerDown = create$u(event => {
+const handleSashCornerPointerDown = create$r(event => {
   const {
     clientX,
     clientY
@@ -4979,15 +4987,15 @@ const handleSashCornerPointerDown = create$u(event => {
   } = event;
   return ['handleSashCornerPointerUp', clientX, clientY];
 });
-const returnValue$6 = true;
+const returnValue$5 = true;
 
 const ViewletE2eTestEvents = {
   __proto__: null,
   handleClickAt: handleClickAt$2,
-  handleContextMenu: handleContextMenu$6,
+  handleContextMenu: handleContextMenu$5,
   handleLoad: handleLoad$3,
   handleSashCornerPointerDown,
-  returnValue: returnValue$6
+  returnValue: returnValue$5
 };
 
 // TODO could use browser view when running in electron
@@ -5048,7 +5056,7 @@ const handleClickAt$1 = event => {
 const handleLoad$2 = event => {
   return ['handleLoad'];
 };
-const handleContextMenu$5 = event => {
+const handleContextMenu$4 = event => {
   preventDefault(event);
   const {
     button,
@@ -5057,14 +5065,14 @@ const handleContextMenu$5 = event => {
   } = event;
   return ['handleContextMenu', button, clientX, clientY];
 };
-const returnValue$5 = true;
+const returnValue$4 = true;
 
 const ViewletE2eTestsEvents = {
   __proto__: null,
   handleClickAt: handleClickAt$1,
-  handleContextMenu: handleContextMenu$5,
+  handleContextMenu: handleContextMenu$4,
   handleLoad: handleLoad$2,
-  returnValue: returnValue$5
+  returnValue: returnValue$4
 };
 
 const sendToIframe = (contentWindow, message, origin, transfer) => {
@@ -5129,10 +5137,10 @@ const ViewletE2eTests = {
 
 const Script = 2;
 
-const handleFocusIn$3 = event => {
+const handleFocusIn$2 = event => {
   preventDefault(event);
   const uid = fromEvent(event);
-  handleFocusIn$4(uid);
+  handleFocusIn$3(uid);
 };
 const handleBlur$6 = event => {
   preventDefault(event);
@@ -5143,7 +5151,7 @@ const handleBlur$6 = event => {
 const ViewletEditorCodeGeneratorEvents = {
   __proto__: null,
   handleBlur: handleBlur$6,
-  handleFocusIn: handleFocusIn$3
+  handleFocusIn: handleFocusIn$2
 };
 
 const setBounds$9 = (state, x, y, width, height) => {
@@ -5159,10 +5167,10 @@ const appendWidget$5 = state => {
   } = state;
   append$1($Viewlet);
 };
-const dispose$f = state => {
+const dispose$d = state => {
   remove$1(state.$Viewlet);
 };
-const focus$d = (state, key, source) => {
+const focus$b = (state, key, source) => {
   if (!key) {
     return;
   }
@@ -5185,12 +5193,12 @@ const ViewletEditorCodeGenerator = {
   __proto__: null,
   Events: ViewletEditorCodeGeneratorEvents,
   appendWidget: appendWidget$5,
-  dispose: dispose$f,
-  focus: focus$d,
+  dispose: dispose$d,
+  focus: focus$b,
   setBounds: setBounds$9
 };
 
-const attachEvents$8 = ($Node, eventMap) => {
+const attachEvents$6 = ($Node, eventMap) => {
   for (const [key, value] of Object.entries(eventMap)) {
     $Node.addEventListener(key, value);
   }
@@ -5309,7 +5317,7 @@ const setNegativeMargin = (state, negativeMargin) => {
   setTop($ListItems, negativeMargin);
 };
 
-const create$q = () => {
+const create$n = () => {
   const $ListItems = document.createElement('div');
   $ListItems.className = 'ListItems';
   $ListItems.role = ListBox;
@@ -5333,24 +5341,24 @@ const create$q = () => {
     $Viewlet
   };
 };
-const attachEvents$7 = state => {
+const attachEvents$5 = state => {
   const {
     $ListItems,
     $ScrollBar,
     $Viewlet
   } = state;
   $Viewlet.addEventListener(Wheel, handleWheel$2, Passive);
-  attachEvents$8($ListItems, {
+  attachEvents$6($ListItems, {
     [MouseDown]: handleMousedown
   });
-  attachEvents$8($ScrollBar, {
+  attachEvents$6($ScrollBar, {
     [PointerDown]: handleScrollBarPointerDown$1
   });
 };
 // TODO show should be passed active cursor position
 // this would make this function easier to test as it would avoid dependency on globals of other files
 
-const setDom$8 = (state, dom) => {
+const setDom$7 = (state, dom) => {
   const {
     $ListItems,
     $Viewlet
@@ -5362,7 +5370,7 @@ const setDom$8 = (state, dom) => {
   // TODO recycle nodes
   // TODO set right aria attributes on $EditorInput
 };
-const dispose$e = state => {
+const dispose$c = state => {
   remove$1(state.$Viewlet);
   // state.$EditorInput.removeAttribute('aria-activedescendant')
 };
@@ -5392,13 +5400,13 @@ const setBounds$8 = (state, x, y, width, height) => {
 
 const ViewletEditorCompletion = {
   __proto__: null,
-  attachEvents: attachEvents$7,
-  create: create$q,
-  dispose: dispose$e,
+  attachEvents: attachEvents$5,
+  create: create$n,
+  dispose: dispose$c,
   handleError: handleError$6,
   setBounds: setBounds$8,
   setContentHeight,
-  setDom: setDom$8,
+  setDom: setDom$7,
   setNegativeMargin,
   setScrollBar: setScrollBar$2,
   setSize,
@@ -5408,15 +5416,15 @@ const ViewletEditorCompletion = {
 const handleClose = () => {
   return ['closeDetails'];
 };
-const returnValue$4 = true;
+const returnValue$3 = true;
 
 const ViewletEditorCompletionDetailsEvents = {
   __proto__: null,
   handleClose,
-  returnValue: returnValue$4
+  returnValue: returnValue$3
 };
 
-const create$p = () => {
+const create$m = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorCompletionDetails';
   $Viewlet.id = 'CompletionsDetails';
@@ -5424,10 +5432,10 @@ const create$p = () => {
     $Viewlet
   };
 };
-const attachEvents$6 = state => {
+const attachEvents$4 = state => {
   // TODO
 };
-const setDom$7 = (state, dom) => {
+const setDom$6 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -5442,7 +5450,7 @@ const appendWidget$4 = state => {
   } = state;
   append$1($Viewlet);
 };
-const dispose$d = state => {
+const dispose$b = state => {
   remove$1(state.$Viewlet);
 };
 const setBounds$7 = (state, x, y, width, height) => {
@@ -5456,11 +5464,11 @@ const ViewletEditorCompletionDetails = {
   __proto__: null,
   Events: ViewletEditorCompletionDetailsEvents,
   appendWidget: appendWidget$4,
-  attachEvents: attachEvents$6,
-  create: create$p,
-  dispose: dispose$d,
+  attachEvents: attachEvents$4,
+  create: create$m,
+  dispose: dispose$b,
   setBounds: setBounds$7,
-  setDom: setDom$7
+  setDom: setDom$6
 };
 
 // TODO not sure whether created dom node
@@ -5476,14 +5484,14 @@ const ViewletEditorCompletionDetails = {
 
 // TODO aria alert
 
-const create$o = () => {
+const create$l = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorError';
   return {
     $Viewlet
   };
 };
-const setDom$6 = (state, dom) => {
+const setDom$5 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -5498,13 +5506,13 @@ const setBounds$6 = (state, x, y, width, height) => {
 
 const ViewletEditorError = {
   __proto__: null,
-  create: create$o,
+  create: create$l,
   setBounds: setBounds$6,
-  setDom: setDom$6
+  setDom: setDom$5
 };
 
-const returnValue$3 = true;
-const handleSashPointerDown$2 = create$u(event => {
+const returnValue$2 = true;
+const handleSashPointerDown$2 = create$r(event => {
   const {
     clientX,
     clientY
@@ -5527,7 +5535,7 @@ const handleSashPointerDown$2 = create$u(event => {
 const ViewletEditorHoverEvents = {
   __proto__: null,
   handleSashPointerDown: handleSashPointerDown$2,
-  returnValue: returnValue$3
+  returnValue: returnValue$2
 };
 
 const setBounds$5 = (state, x, y, width, height) => {
@@ -5543,7 +5551,7 @@ const appendWidget$3 = state => {
   } = state;
   append$1($Viewlet);
 };
-const setDom$5 = (state, dom) => {
+const setDom$4 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -5555,7 +5563,7 @@ const ViewletEditorHover = {
   Events: ViewletEditorHoverEvents,
   appendWidget: appendWidget$3,
   setBounds: setBounds$5,
-  setDom: setDom$5
+  setDom: setDom$4
 };
 
 const LeftClick = 0;
@@ -5638,7 +5646,7 @@ const handleWheel$1 = event => {
  *
  * @param {MouseEvent} event
  */
-const handleContextMenu$4 = event => {
+const handleContextMenu$3 = event => {
   preventDefault(event);
   const {
     button,
@@ -5646,7 +5654,7 @@ const handleContextMenu$4 = event => {
     clientY
   } = event;
   const uid = fromEvent(event);
-  handleContextMenu$7(uid, button, clientX, clientY);
+  handleContextMenu$6(uid, button, clientX, clientY);
 };
 const handleError$5 = event => {
   const uid = fromEvent(event);
@@ -5657,19 +5665,19 @@ const handleFocus$6 = event => {
   handleFocus$8(uid);
 };
 
-const create$n = () => {
+const create$k = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorImage';
   return {
     $Viewlet
   };
 };
-const attachEvents$5 = state => {
+const attachEvents$3 = state => {
   const {
     $Viewlet
   } = state;
-  attachEvents$8($Viewlet, {
-    [ContextMenu]: handleContextMenu$4,
+  attachEvents$6($Viewlet, {
+    [ContextMenu]: handleContextMenu$3,
     [FocusIn]: handleFocus$6,
     [PointerDown]: handlePointerDown$1,
     [PointerUp]: handlePointerUp
@@ -5690,7 +5698,7 @@ const setDragging = (state, isDragging) => {
   } = state;
   $Viewlet.classList.toggle('Dragging', isDragging);
 };
-const setDom$4 = (state, dom) => {
+const setDom$3 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -5699,14 +5707,14 @@ const setDom$4 = (state, dom) => {
 
 const ViewletEditorImage = {
   __proto__: null,
-  attachEvents: attachEvents$5,
-  create: create$n,
-  setDom: setDom$4,
+  attachEvents: attachEvents$3,
+  create: create$k,
+  setDom: setDom$3,
   setDragging,
   setTransform
 };
 
-const create$m = () => {
+const create$j = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorText';
   $Viewlet.textContent = 'loading...';
@@ -5714,7 +5722,7 @@ const create$m = () => {
     $Viewlet
   };
 };
-const dispose$c = state => {};
+const dispose$a = state => {};
 const refresh$3 = (state, context) => {
   object(state);
   string(context.content);
@@ -5723,20 +5731,20 @@ const refresh$3 = (state, context) => {
 
 const ViewletEditorPlainText = {
   __proto__: null,
-  create: create$m,
-  dispose: dispose$c,
+  create: create$j,
+  dispose: dispose$a,
   refresh: refresh$3
 };
 
-const handleFocusIn$2 = event => {
+const handleFocusIn$1 = event => {
   preventDefault(event);
   const uid = fromEvent(event);
-  handleFocusIn$4(uid);
+  handleFocusIn$3(uid);
 };
 
 const ViewletEditorSourceActionsEvents = {
   __proto__: null,
-  handleFocusIn: handleFocusIn$2
+  handleFocusIn: handleFocusIn$1
 };
 
 const setBounds$4 = (state, x, y, width, height) => {
@@ -5752,7 +5760,7 @@ const appendWidget$2 = state => {
   } = state;
   append$1($Viewlet);
 };
-const dispose$b = state => {
+const dispose$9 = state => {
   remove$1(state.$Viewlet);
 };
 
@@ -5760,7 +5768,7 @@ const ViewletEditorSourceActions = {
   __proto__: null,
   Events: ViewletEditorSourceActionsEvents,
   appendWidget: appendWidget$2,
-  dispose: dispose$b,
+  dispose: dispose$9,
   setBounds: setBounds$4
 };
 
@@ -5994,7 +6002,7 @@ const handlePaste = event => {
   const text = getText(clipboardData);
   return ['paste', text];
 };
-const handleScrollBarVerticalPointerDown = create$u(event => {
+const handleScrollBarVerticalPointerDown = create$r(event => {
   const {
     clientY
   } = event;
@@ -6049,7 +6057,7 @@ const handleScrollBarContextMenu = event => {
   preventDefault(event);
   stopPropagation(event);
 };
-const handleContextMenu$3 = event => {
+const handleContextMenu$2 = event => {
   preventDefault(event);
   const {
     button,
@@ -6117,7 +6125,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$l = () => {
+const create$i = () => {
   const $EditorInput = document.createElement('textarea');
   $EditorInput.className = 'EditorInput';
   $EditorInput.ariaAutoComplete = List;
@@ -6205,7 +6213,7 @@ const create$l = () => {
   $Editor.role = Code;
   $Editor.append($LayerGutter, $EditorContent);
   attachEventsFunctional($Editor, {
-    [ContextMenu]: handleContextMenu$3,
+    [ContextMenu]: handleContextMenu$2,
     [Wheel]: handleWheel,
     returnValue: true
   });
@@ -6263,7 +6271,7 @@ const setSelections$1 = (state, cursorInfos, selectionInfos) => {
   setCursors(state, cursorInfos);
   setSelections$2(state, selectionInfos);
 };
-const setFocused$2 = async (state, isFocused) => {
+const setFocused$1 = async (state, isFocused) => {
   const {
     $EditorInput
   } = state;
@@ -6284,7 +6292,7 @@ const setDecorationsDom$1 = (state, decorations) => {
   setDecorationsDom$2(state, decorations);
 };
 
-const create$k = create$l;
+const create$h = create$i;
 const setText$1 = setText$2;
 const setSelections = setSelections$1;
 const setIncrementalEdits = setIncrementalEdits$1;
@@ -6320,20 +6328,20 @@ const hideOverlayMessage = state => {
     }
   }
 };
-const setFocused$1 = setFocused$2;
-const focus$c = setFocused$2;
+const setFocused = setFocused$1;
+const focus$a = setFocused$1;
 const setDecorationsDom = setDecorationsDom$1;
 
 const ViewletEditorText = {
   __proto__: null,
-  create: create$k,
-  focus: focus$c,
+  create: create$h,
+  focus: focus$a,
   handleError: handleError$4,
   hideOverlayMessage,
   highlightAsLink,
   renderGutter,
   setDecorationsDom,
-  setFocused: setFocused$1,
+  setFocused,
   setIncrementalEdits,
   setScrollBar,
   setScrollBarHorizontal,
@@ -6342,7 +6350,7 @@ const ViewletEditorText = {
   showOverlayMessage
 };
 
-const create$j = () => {
+const create$g = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorTextError';
   return {
@@ -6358,11 +6366,11 @@ const setMessage$3 = (state, message) => {
 
 const ViewletEditorTextError = {
   __proto__: null,
-  create: create$j,
+  create: create$g,
   setMessage: setMessage$3
 };
 
-const create$i = () => {
+const create$f = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorWidgetError EditorOverlayMessage';
   return {
@@ -6385,12 +6393,12 @@ const setBounds$3 = (state, x, y, width, height) => {
 
 const ViewletEditorWidgetError = {
   __proto__: null,
-  create: create$i,
+  create: create$f,
   setBounds: setBounds$3,
   setMessage: setMessage$2
 };
 
-const create$h = () => {
+const create$e = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.dataset.viewlet = 'Empty';
   $Viewlet.className = 'Viewlet';
@@ -6399,18 +6407,18 @@ const create$h = () => {
   };
 };
 const refresh$2 = (state, context) => {};
-const focus$b = state => {};
-const dispose$a = state => {};
+const focus$9 = state => {};
+const dispose$8 = state => {};
 
 const ViewletEmpty = {
   __proto__: null,
-  create: create$h,
-  dispose: dispose$a,
-  focus: focus$b,
+  create: create$e,
+  dispose: dispose$8,
+  focus: focus$9,
   refresh: refresh$2
 };
 
-const create$g = () => {
+const create$d = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EmptyEditor';
   return {
@@ -6420,10 +6428,10 @@ const create$g = () => {
 
 const ViewletEmptyEditor = {
   __proto__: null,
-  create: create$g
+  create: create$d
 };
 
-const create$f = () => {
+const create$c = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Error';
   return {
@@ -6439,7 +6447,7 @@ const setMessage$1 = (state, message) => {
 
 const ViewletError = {
   __proto__: null,
-  create: create$f,
+  create: create$c,
   setMessage: setMessage$1
 };
 
@@ -6509,7 +6517,7 @@ const handleFocusClose = event => {
 const handleFocusReplaceAll = event => {
   return ['FindWidget.handleFocusReplaceAll'];
 };
-const returnValue$2 = true;
+const returnValue$1 = true;
 
 const ViewletFindWidgetEvents = {
   __proto__: null,
@@ -6529,10 +6537,10 @@ const ViewletFindWidgetEvents = {
   handleReplaceFocus,
   handleReplaceInput,
   handleToggleReplaceFocus,
-  returnValue: returnValue$2
+  returnValue: returnValue$1
 };
 
-const create$e = () => {
+const create$b = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet FindWidget';
   $Viewlet.role = Group;
@@ -6540,7 +6548,7 @@ const create$e = () => {
     $Viewlet
   };
 };
-const focus$a = (state, key, source) => {
+const focus$8 = (state, key, source) => {
   if (!key) {
     return;
   }
@@ -6574,7 +6582,7 @@ const appendWidget$1 = state => {
   } = state;
   append$1($Viewlet);
 };
-const setDom$3 = (state, dom) => {
+const setDom$2 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -6586,20 +6594,20 @@ const setBounds$2 = (state, x, y, width, height) => {
   } = state;
   setBounds$a($Viewlet, x, y, width, height);
 };
-const dispose$9 = state => {
+const dispose$7 = state => {
   remove$1(state.$Viewlet);
 };
-const Events$3 = ViewletFindWidgetEvents;
+const Events$2 = ViewletFindWidgetEvents;
 
 const ViewletFindWidget = {
   __proto__: null,
-  Events: Events$3,
+  Events: Events$2,
   appendWidget: appendWidget$1,
-  create: create$e,
-  dispose: dispose$9,
-  focus: focus$a,
+  create: create$b,
+  dispose: dispose$7,
+  focus: focus$8,
   setBounds: setBounds$2,
-  setDom: setDom$3,
+  setDom: setDom$2,
   setValue: setValue$1
 };
 
@@ -6621,7 +6629,7 @@ const ViewletLocationsEvents = {
   handleLocationsMouseDown
 };
 
-const setFocusedIndex$1 = (state, oldFocusedIndex, newFocusedIndex) => {
+const setFocusedIndex = (state, oldFocusedIndex, newFocusedIndex) => {
   const {
     $Viewlet
   } = state;
@@ -6644,7 +6652,7 @@ const handleError$3 = (state, message) => {
   } = state;
   $Message.textContent = message;
 };
-const focus$9 = state => {
+const focus$7 = state => {
   const {
     $Locations
   } = state;
@@ -6656,9 +6664,9 @@ const focus$9 = state => {
 const ViewletImplementations = {
   __proto__: null,
   Events: ViewletLocationsEvents,
-  focus: focus$9,
+  focus: focus$7,
   handleError: handleError$3,
-  setFocusedIndex: setFocusedIndex$1
+  setFocusedIndex
 };
 
 const handleScrollBarPointerDown = event => {
@@ -6749,11 +6757,11 @@ const setColumnWidths = (state, columnWidth1, columnWidth2, columnWidth3) => {
   $Resizer1.style.left = `${paddingLeft + columnWidth1}px`;
   $Resizer2.style.left = `${paddingLeft + columnWidth1 + columnWidth2}px`;
 };
-const Events$2 = ViewletkeyBindingsEvents;
+const Events$1 = ViewletkeyBindingsEvents;
 
 const ViewletKeyBindings = {
   __proto__: null,
-  Events: Events$2,
+  Events: Events$1,
   setColumnWidths,
   setScrollBar: setScrollBar$2,
   setSize,
@@ -7258,7 +7266,7 @@ const handleBlur$3 = () => {
 const handleKeyDown$1 = handleKeyDown$2;
 const handleKeyUp = handleKeyUp$1;
 
-const create$d = () => {
+const create$a = () => {
   // TODO use aria role splitter once supported https://github.com/w3c/aria/issues/1348
   const $SashSideBar = document.createElement('div');
   $SashSideBar.className = 'Viewlet Sash SashVertical';
@@ -7279,20 +7287,20 @@ const create$d = () => {
     $Viewlet
   };
 };
-const attachEvents$4 = state => {
+const attachEvents$2 = state => {
   const {
     $SashPanel,
     $SashSideBar
   } = state;
-  attachEvents$8($SashSideBar, {
+  attachEvents$6($SashSideBar, {
     [DoubleClick]: handleSashDoubleClick,
     [PointerDown]: handleSashPointerDown
   });
-  attachEvents$8($SashPanel, {
+  attachEvents$6($SashPanel, {
     [DoubleClick]: handleSashDoubleClick,
     [PointerDown]: handleSashPointerDown
   });
-  attachEvents$8(window, {
+  attachEvents$6(window, {
     [Blur]: handleBlur$3,
     [Focus]: handleFocus$2,
     [KeyDown]: handleKeyDown$1,
@@ -7313,404 +7321,74 @@ const setSashes = (state, sashSideBar, sashPanel) => {
 
 const ViewletLayout = {
   __proto__: null,
-  attachEvents: attachEvents$4,
-  create: create$d,
+  attachEvents: attachEvents$2,
+  create: create$a,
   setSashes
 };
 
-const CopyMove = 'copyMove';
-
-const ResourceUrls = 'resourceurls';
+const ActivityBar = 'ActivityBar';
+const Audio$1 = 'Audio';
+const Clock = 'Clock';
+const ColorPicker = 'ColorPicker';
+const DebugConsole = 'Debug Console';
+const DefineKeyBinding = 'DefineKeyBinding';
+const Dialog = 'Dialog';
+const DiffEditor = 'DiffEditor';
+const EditorCompletion = 'EditorCompletion';
+const EmptyEditor = 'EmptyEditor';
+const EditorError = 'EditorError';
+const EditorHover = 'EditorHover';
+const EditorImage = 'EditorImage';
+const EditorPlainText = 'EditorPlainText';
+const EditorText = 'Editor';
+const EditorWidgetError = 'EditorWidgetError';
+const Empty = 'Empty';
+const Error$1 = 'Error';
+const FindWidget = 'FindWidget';
+const ImagePreview = 'ImagePreview';
+const InlineDiffEditor = 'InlineDiffEditor';
+const Implementations = 'Implementations';
+const KeyBindings = 'KeyBindings';
+const Layout = 'Layout';
+const Output = 'Output';
+const Panel = 'Panel';
+const References = 'References';
+const RunAndDebug = 'Run And Debug';
+const ScreenCapture = 'ScreenCapture';
+const SideBar = 'SideBar';
+const SimpleBrowser = 'SimpleBrowser';
+const SourceControl = 'Source Control';
+const StatusBar = 'StatusBar';
+const Storage = 'Storage';
+const Terminal = 'Terminal';
+const Terminals = 'Terminals';
+const Video = 'Video';
+const EditorSourceActions = 'EditorSourceActions';
+const E2eTests = 'E2eTests';
+const E2eTest = 'E2eTest';
+const WebView = 'WebView';
+const EditorCompletionDetails = 'EditorCompletionDetails';
+const EditorTextError = 'EditorTextError';
+const EditorRename = 'EditorRename';
+const EditorCodeGenerator = 'EditorCodeGenerator';
 
-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 {
-    clientX,
-    clientY,
-    dataTransfer
-  } = 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$2 = event => {
-  if (event.defaultPrevented) {
-    return;
-  }
-  preventDefault(event);
-  const {
-    clientX,
-    clientY
-  } = event;
-  const uid = fromEvent(event);
-  handleContextMenu$7(uid, clientX, clientY);
-};
-
-// TODO Main should not be bound to Editor -> Lazy load Editor
-const create$c = () => {
-  const $Viewlet = document.createElement('div');
-  $Viewlet.id = 'Main';
-  $Viewlet.className = 'Viewlet Main';
-  $Viewlet.role = Main$1;
-
-  // const $MainTabs = document.createElement('div')
-  // $MainTabs.className = 'MainTabs'
-  // $MainTabs.onmousedown = handleTabsMouseDown
-  // $MainTabs.oncontextmenu = handleTabsContextMenu
-  // // TODO race condition: what if tab has already been closed?
-  // $Main.append($MainTabs, $MainContent)
-
-  return {
-    $DragOverlay: undefined,
-    $Main: $Viewlet,
-    $MainContent: undefined,
-    $MainTabs: undefined,
-    $Viewlet
-  };
-};
-const attachEvents$3 = state => {
-  const {
-    $Viewlet
-  } = state;
-  attachEvents$8($Viewlet, {
-    [ContextMenu]: handleContextMenu$2,
-    [DragEnd]: handleDragEnd,
-    [DragLeave]: handleDragLeave,
-    [DragOver]: handleDragOver$1,
-    [Drop]: handleDrop$1
-  });
-};
-const dispose$8 = state => {};
-const replaceEditor = (state, id, uri, languageId) => {};
-const addEditor = (state, id, uri, languageId) => {};
-
-// TODO there are 3 cases
-// 1. no editor group and no editor
-// 2. editor group exists and new editor should be added
-// 3. editor group exists and editor should be replaced
-const openEditor = async (state, id, uri, languageId) => {};
-const closeAllViewlets = state => {
-  const {
-    $Main
-  } = state;
-  while ($Main.firstChild) {
-    $Main.firstChild.remove();
-  }
-  state.$MainTabs = undefined;
-};
-const closeViewletAndTab = (state, index) => {
-  state.$MainTabs.remove();
-  state.$MainTabs = undefined;
-};
-const focus$8 = () => {};
-const highlightDragOver = state => {
-  const {
-    $MainTabs
-  } = state;
-  $MainTabs.classList.add('DragOver');
-};
-const stopHighlightDragOver = state => {
-  const {
-    $MainTabs
-  } = state;
-  $MainTabs.classList.remove('DragOver');
-};
-const create$DragOverlay = () => {
-  const $Overlay = document.createElement('div');
-  $Overlay.className = 'DragOverlay';
-  return $Overlay;
-};
-const setDragOverlay = (state, visible, x, y, width, height) => {
-  const hasOverlay = state.$DragOverlay;
-  if (!visible) {
-    if (hasOverlay) {
-      state.$DragOverlay.remove();
-      state.$DragOverlay = undefined;
-    }
-    return;
-  }
-  if (!hasOverlay) {
-    state.$DragOverlay = create$DragOverlay();
-  }
-  const {
-    $DragOverlay
-  } = state;
-  setBounds$a($DragOverlay, x, y, width, height);
-  if (!hasOverlay) {
-    document.body.append($DragOverlay);
-  }
-};
-
-const ViewletMain = {
-  __proto__: null,
-  addEditor,
-  attachEvents: attachEvents$3,
-  closeAllViewlets,
-  closeViewletAndTab,
-  create: create$c,
-  dispose: dispose$8,
-  focus: focus$8,
-  highlightDragOver,
-  openEditor,
-  replaceEditor,
-  setDragOverlay,
-  stopHighlightDragOver
-};
-
-// TODO
-const getUid = () => {
-  const $Main = document.getElementById('Main');
-  if (!$Main) {
-    return 0;
-  }
-  return get($Main);
-};
-const handleTabsWheel = event => {
-  const uid = getUid();
-  const {
-    deltaX,
-    deltaY
-  } = event;
-  handleTabsWheel$1(uid, deltaX, deltaY);
-};
-const handleDragStart = event => {
-  const {
-    dataTransfer,
-    target
-  } = event;
-  setEffectAllowed(dataTransfer, CopyMove);
-  dataTransfer.setData('x-lvce-drag', target.dataset.dragUid);
-};
-const handleDragOver = event => {
-  const {
-    clientX,
-    clientY
-  } = event;
-  const uid = getUid();
-  handleTabsDragOver(uid, clientX, clientY);
-};
-
-/**
- *
- * @param {DragEvent} event
- */
-const handleDrop = event => {
-  preventDefault(event);
-  const {
-    clientX,
-    clientY,
-    dataTransfer
-  } = event;
-  const item = dataTransfer.getData('x-lvce-drag');
-  const uid = getUid();
-  handleTabDrop(uid, item, clientX, clientY);
-};
-const handleTabsMouseDown = event => {
-  const {
-    button,
-    clientX,
-    clientY
-  } = event;
-  const uid = getUid();
-  handleTabClick(uid, button, clientX, clientY);
-};
-const handleTabsContextMenu = event => {
-  const {
-    clientX,
-    clientY
-  } = event;
-  preventDefault(event);
-  const uid = getUid();
-  handleTabContextMenu(uid, clientX, clientY);
-};
-
-const create$b = () => {
-  const $MainTabs = document.createElement('div');
-  $MainTabs.className = 'Viewlet MainTabs';
-  $MainTabs.role = TabList;
-  // TODO race condition: what if tab has already been closed?
-  return {
-    $MainTabs,
-    $Viewlet: $MainTabs
-  };
-};
-const attachEvents$2 = state => {
-  const {
-    $MainTabs
-  } = state;
-  attachEvents$8($MainTabs, {
-    [ContextMenu]: handleTabsContextMenu,
-    [DragOver]: handleDragOver,
-    [DragStart]: handleDragStart,
-    [Drop]: handleDrop,
-    [MouseDown]: handleTabsMouseDown
-  });
-  $MainTabs.addEventListener(Wheel, handleTabsWheel, Passive);
-};
-const setTabsDom$2 = (state, dom) => {
-  const {
-    $Viewlet
-  } = state;
-  renderInto($Viewlet, dom);
-};
-const setScrollLeft = (state, scrollLeft) => {
-  const {
-    $Viewlet
-  } = state;
-  $Viewlet.scrollLeft = scrollLeft;
-};
-const setHighlight = (state, highlightLeft) => {
-  const $ExistingHighlight = state.$Viewlet.querySelector('.TabDragHighlight');
-  if ($ExistingHighlight) {
-    $ExistingHighlight.remove();
-  }
-  const $Highlight = document.createElement('div');
-  $Highlight.className = 'TabDragHighlight';
-  $Highlight.style.left = `${highlightLeft}px`;
-  state.$Viewlet.append($Highlight);
-};
-
-const ViewletMainTabs = {
-  __proto__: null,
-  attachEvents: attachEvents$2,
-  create: create$b,
-  setHighlight,
-  setScrollLeft,
-  setTabsDom: setTabsDom$2
-};
-
-const ActivityBar = 'ActivityBar';
-const Audio$1 = 'Audio';
-const Clock = 'Clock';
-const ColorPicker = 'ColorPicker';
-const DebugConsole = 'Debug Console';
-const DefineKeyBinding = 'DefineKeyBinding';
-const Dialog = 'Dialog';
-const DiffEditor = 'DiffEditor';
-const EditorCompletion = 'EditorCompletion';
-const EmptyEditor = 'EmptyEditor';
-const EditorError = 'EditorError';
-const EditorHover = 'EditorHover';
-const EditorImage = 'EditorImage';
-const EditorPlainText = 'EditorPlainText';
-const EditorText = 'Editor';
-const EditorWidgetError = 'EditorWidgetError';
-const Empty = 'Empty';
-const Error$1 = 'Error';
-const FindWidget = 'FindWidget';
-const ImagePreview = 'ImagePreview';
-const InlineDiffEditor = 'InlineDiffEditor';
-const Implementations = 'Implementations';
-const KeyBindings = 'KeyBindings';
-const Layout = 'Layout';
-const Main = 'Main';
-const MainTabs = 'MainTabs';
-const Output = 'Output';
-const Panel = 'Panel';
-const References = 'References';
-const RunAndDebug = 'Run And Debug';
-const ScreenCapture = 'ScreenCapture';
-const SideBar = 'SideBar';
-const SimpleBrowser = 'SimpleBrowser';
-const SourceControl = 'Source Control';
-const StatusBar = 'StatusBar';
-const Storage = 'Storage';
-const Terminal = 'Terminal';
-const Terminals = 'Terminals';
-const TitleBar = 'TitleBar';
-const TitleBarButtons = 'TitleBarButtons';
-const TitleBarIcon = 'TitleBarIcon';
-const TitleBarMenuBar = 'TitleBarMenuBar';
-const Video = 'Video';
-const TitleBarTitle = 'TitleBarTitle';
-const EditorSourceActions = 'EditorSourceActions';
-const E2eTests = 'E2eTests';
-const E2eTest = 'E2eTest';
-const WebView = 'WebView';
-const EditorCompletionDetails = 'EditorCompletionDetails';
-const EditorTextError = 'EditorTextError';
-const EditorRename = 'EditorRename';
-const EditorCodeGenerator = 'EditorCodeGenerator';
-
-const create$a = () => {
-  const $ViewletOutputContent = document.createElement('div');
-  $ViewletOutputContent.className = 'OutputContent';
-  $ViewletOutputContent.role = Log;
-  $ViewletOutputContent.tabIndex = 0;
-  const $ViewletOutputWidgets = document.createElement('div');
-  $ViewletOutputWidgets.className = 'OutputWidgets';
-  const $Viewlet = document.createElement('div');
-  $Viewlet.className = 'Viewlet Output';
-  $Viewlet.tabIndex = 0;
-  $Viewlet.append($ViewletOutputContent, $ViewletOutputWidgets);
-  return {
-    $Content: $ViewletOutputContent,
-    $Viewlet,
-    $ViewletOutputContent,
-    content: $ViewletOutputContent
-  };
+const create$9 = () => {
+  const $ViewletOutputContent = document.createElement('div');
+  $ViewletOutputContent.className = 'OutputContent';
+  $ViewletOutputContent.role = Log;
+  $ViewletOutputContent.tabIndex = 0;
+  const $ViewletOutputWidgets = document.createElement('div');
+  $ViewletOutputWidgets.className = 'OutputWidgets';
+  const $Viewlet = document.createElement('div');
+  $Viewlet.className = 'Viewlet Output';
+  $Viewlet.tabIndex = 0;
+  $Viewlet.append($ViewletOutputContent, $ViewletOutputWidgets);
+  return {
+    $Content: $ViewletOutputContent,
+    $Viewlet,
+    $ViewletOutputContent,
+    content: $ViewletOutputContent
+  };
 };
 const setText = (state, text) => {
   object(state);
@@ -7726,9 +7404,9 @@ const handleError$2 = (state, error) => {
   string(error);
   state.content.textContent = error;
 };
-const focus$7 = state => {
+const focus$6 = state => {
   object(state);
-  focus$f(state.$ViewletOutputContent);
+  focus$d(state.$ViewletOutputContent);
   send('Focus.setFocus', FocusOutput);
 };
 
@@ -7741,15 +7419,15 @@ const disposeFindWidget = state => {
     return;
   }
 };
-const dispose$7 = state => {};
+const dispose$6 = state => {};
 
 const ViewletOutput = {
   __proto__: null,
   clear: clear$1,
-  create: create$a,
-  dispose: dispose$7,
+  create: create$9,
+  dispose: dispose$6,
   disposeFindWidget,
-  focus: focus$7,
+  focus: focus$6,
   handleError: handleError$2,
   openFindWidget,
   setText
@@ -7800,7 +7478,7 @@ const UiStrings = {
   Close: 'Close',
   Maximize: 'Maximize'
 };
-const create$9 = () => {
+const create$8 = () => {
   const $PanelTabs = document.createElement('div');
   $PanelTabs.className = 'PanelTabs';
   $PanelTabs.role = TabList;
@@ -7844,13 +7522,13 @@ const attachEvents$1 = state => {
     $ButtonMaximize,
     $PanelHeader
   } = state;
-  attachEvents$8($PanelHeader, {
+  attachEvents$6($PanelHeader, {
     [Click]: handleHeaderClick$1
   });
-  attachEvents$8($ButtonMaximize, {
+  attachEvents$6($ButtonMaximize, {
     [Click]: handleClickMaximize
   });
-  attachEvents$8($ButtonClose, {
+  attachEvents$6($ButtonClose, {
     [Click]: handleClickClose
   });
 };
@@ -7862,14 +7540,14 @@ const setTabsDom$1 = (state, dom) => {
 };
 
 // TODO add test for focus method
-const focus$6 = state => {
+const focus$5 = state => {
   object(state);
   if (!state.currentViewlet) {
     return;
   }
   state.currentViewlet.factory.focus(state.currentViewlet.state);
 };
-const dispose$6 = state => {
+const dispose$5 = state => {
   if (state.$PanelContent) {
     state.$PanelContent.remove();
     state.$PanelContent = undefined;
@@ -7914,9 +7592,9 @@ const setActionsDom$1 = (state, actions, childUid) => {
 const ViewletPanel = {
   __proto__: null,
   attachEvents: attachEvents$1,
-  create: create$9,
-  dispose: dispose$6,
-  focus: focus$6,
+  create: create$8,
+  dispose: dispose$5,
+  focus: focus$5,
   setActionsDom: setActionsDom$1,
   setSelectedIndex,
   setTabsDom: setTabsDom$1
@@ -7925,9 +7603,9 @@ const ViewletPanel = {
 const ViewletReferences = {
   __proto__: null,
   Events: ViewletLocationsEvents,
-  focus: focus$9,
+  focus: focus$7,
   handleError: handleError$3,
-  setFocusedIndex: setFocusedIndex$1
+  setFocusedIndex
 };
 
 const ViewletRunAndDebug = {
@@ -7942,7 +7620,7 @@ const handleLoadedMetaData = event => {
   target.play();
 };
 
-const create$8 = () => {
+const create$7 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet ScreenCapture';
   return {
@@ -7962,7 +7640,7 @@ const setScreenCapture = (state, id) => {
 
 const ViewletScreenCapture = {
   __proto__: null,
-  create: create$8,
+  create: create$7,
   setScreenCapture
 };
 
@@ -7982,7 +7660,7 @@ const handleHeaderClick = event => {
   }
 };
 
-const create$7 = () => {
+const create$6 = () => {
   const $SideBarTitleAreaTitle = document.createElement('h2');
   $SideBarTitleAreaTitle.className = 'SideBarTitleAreaTitle';
   const $SideBarTitleArea = document.createElement('div');
@@ -8007,11 +7685,11 @@ const attachEvents = state => {
   const {
     $SideBarTitleArea
   } = state;
-  attachEvents$8($SideBarTitleArea, {
+  attachEvents$6($SideBarTitleArea, {
     [Click]: handleHeaderClick
   });
 };
-const dispose$5 = state => {
+const dispose$4 = state => {
   object(state);
   state.$SideBar.replaceChildren();
 };
@@ -8039,16 +7717,16 @@ const setActionsDom = (state, actions, parentId, eventMap = {}) => {
   }
   state.$Actions = $NewViewlet;
 };
-const focus$5 = async () => {
+const focus$4 = async () => {
   // await
 };
 
 const ViewletSideBar = {
   __proto__: null,
   attachEvents,
-  create: create$7,
-  dispose: dispose$5,
-  focus: focus$5,
+  create: create$6,
+  dispose: dispose$4,
+  focus: focus$4,
   setActionsDom,
   setTitle
 };
@@ -8142,7 +7820,7 @@ const handleContextMenu$1 = event => {
     clientY
   } = event;
   const uid = fromEvent(event);
-  handleContextMenu$7(uid, button, clientX, clientY);
+  handleContextMenu$6(uid, button, clientX, clientY);
 };
 
 const handleFocus = event => {
@@ -8160,7 +7838,7 @@ const getButtonIndex = $Node => {
   }
   return index;
 };
-const handleClick$3 = event => {
+const handleClick$2 = event => {
   const {
     target
   } = event;
@@ -8178,7 +7856,7 @@ const handleClick$3 = event => {
   if (index === -1) {
     return;
   }
-  handleClick$6(uid, index);
+  handleClick$5(uid, index);
 };
 const handleMouseOver = event => {
   const {
@@ -8222,7 +7900,7 @@ const handleInput$1 = event => {
 
 const ViewletSourceControlEvents = {
   __proto__: null,
-  handleClick: handleClick$3,
+  handleClick: handleClick$2,
   handleContextMenu: handleContextMenu$1,
   handleFocus,
   handleInput: handleInput$1,
@@ -8231,7 +7909,7 @@ const ViewletSourceControlEvents = {
   handleWheel: handleWheel$3
 };
 
-const focus$4 = state => {
+const focus$3 = state => {
   const {
     $Viewlet
   } = state;
@@ -8241,24 +7919,24 @@ const focus$4 = state => {
 const ViewletSourceControl = {
   __proto__: null,
   Events: ViewletSourceControlEvents,
-  focus: focus$4
+  focus: focus$3
 };
 
-const handleClick$2 = event => {
+const handleClick$1 = event => {
   const uid = fromEvent(event);
   const {
     clientX,
     clientY
   } = event;
-  handleClick$6(uid, clientX, clientY);
+  handleClick$5(uid, clientX, clientY);
 };
 
 const ViewletStatusBarEvents = {
   __proto__: null,
-  handleClick: handleClick$2
+  handleClick: handleClick$1
 };
 
-const create$6 = () => {
+const create$5 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.id = 'StatusBar';
   $Viewlet.className = 'Viewlet StatusBar';
@@ -8266,18 +7944,18 @@ const create$6 = () => {
   $Viewlet.role = Status;
   $Viewlet.ariaRoleDescription = StatusBar$1;
   $Viewlet.ariaLive = 'off'; // see https://github.com/microsoft/vscode/issues/94677
-  $Viewlet.addEventListener('click', handleClick$2);
+  $Viewlet.addEventListener('click', handleClick$1);
   return {
     $Viewlet
   };
 };
-const setDom$2 = (state, dom) => {
+const setDom$1 = (state, dom) => {
   const {
     $Viewlet
   } = state;
   renderInto($Viewlet, dom, ViewletStatusBarEvents);
 };
-const focus$3 = state => {
+const focus$2 = state => {
   object(state);
   const {
     $Viewlet
@@ -8287,26 +7965,26 @@ const focus$3 = state => {
 
 const ViewletStatusBar = {
   __proto__: null,
-  create: create$6,
-  focus: focus$3,
-  setDom: setDom$2
+  create: create$5,
+  focus: focus$2,
+  setDom: setDom$1
 };
 
-const handleClick$1 = event => {
+const handleClick = event => {
   const uid = fromEvent(event);
-  handleClick$6(uid);
+  handleClick$5(uid);
 };
 
 const ViewletStorageEvents = {
   __proto__: null,
-  handleClick: handleClick$1
+  handleClick
 };
 
-const Events$1 = ViewletStorageEvents;
+const Events = ViewletStorageEvents;
 
 const ViewletStorage = {
   __proto__: null,
-  Events: Events$1
+  Events
 };
 
 const handleClickTab = event => {
@@ -8318,7 +7996,7 @@ const handleClickTab = event => {
   handleClickTab$2(uid, index);
 };
 
-const create$5 = () => {
+const create$4 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Terminals';
   return {
@@ -8344,420 +8022,9 @@ const setTabsDom = (state, dom) => {
 };
 
 const ViewletTerminals = {
-  __proto__: null,
-  create: create$5,
-  setTabsDom
-};
-
-const isInsideTitleBarMenu = $Element => {
-  return $Element.classList.contains('MenuItem') || $Element.classList.contains('Menu') || $Element.classList.contains('TitleBarTopLevelEntry') || $Element.classList.contains('TitleBarMenuBar');
-};
-const handleFocusOut = event => {
-  const {
-    relatedTarget,
-    target
-  } = event;
-  if (relatedTarget && isInsideTitleBarMenu(relatedTarget)) {
-    return;
-  }
-  if (target && isInsideTitleBarMenu(target)) {
-    return;
-  }
-  const uid = fromEvent(event);
-  closeMenu$1(uid);
-};
-const handlePointerOver = event => {
-  const {
-    target
-  } = event;
-  const index = getIndex(target);
-  const uid = fromEvent(event);
-  handleMouseOver$1(uid, index);
-};
-const handlePointerOut = event => {
-  const {
-    target
-  } = event;
-  const index = getIndex(target);
-  const uid = fromEvent(event);
-  handleMouseOut$1(uid, index);
-};
-const getIndex = $Target => {
-  if ($Target.classList.contains('TitleBarTopLevelEntry')) {
-    return getNodeIndex($Target);
-  }
-  return -1;
-};
-const handleClick = event => {
-  const {
-    button,
-    target
-  } = event;
-  const index = getIndex(target);
-  const uid = fromEvent(event);
-  handleClick$6(uid, button, index);
-};
-const getLevelAndIndex = event => {
-  const {
-    target
-  } = event;
-  const $Menu = target.closest('.Menu');
-  const index = findIndex($Menu, target);
-  const {
-    id
-  } = $Menu;
-  const level = Number.parseInt(id.slice(5));
-  return {
-    index,
-    level
-  };
-};
-const handleMenuMouseOver = event => {
-  // TODO just send pixel coordinates instead
-  const {
-    index,
-    level
-  } = getLevelAndIndex(event);
-  const uid = fromEvent(event);
-  handleMenuMouseOver$1(uid, level, index);
-};
-const handleMenuClick = event => {
-  const {
-    index,
-    level
-  } = getLevelAndIndex(event);
-  const uid = fromEvent(event);
-  handleMenuClick$1(uid, level, index);
-};
-const handleFocusIn$1 = event => {
-  const uid = fromEvent(event);
-  handleFocus$8(uid);
-};
-
-const ViewletTitleBarMenuBarEvents = {
-  __proto__: null,
-  handleClick,
-  handleFocusIn: handleFocusIn$1,
-  handleFocusOut,
-  handleMenuClick,
-  handleMenuMouseOver,
-  handlePointerOut,
-  handlePointerOver
-};
-
-const activeId = 'TitleBarEntryActive';
-const dispose$4 = state => {};
-const focus$2 = state => {
-  const {
-    $TitleBarMenuBar
-  } = state;
-  $TitleBarMenuBar.firstChild.focus();
-};
-
-// TODO set proper tabIndex 0 to focused item https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1.html
-
-// TODO screenreader doesn't read top level label
-// when menu is open,
-// first item is selected,
-// right is clicked it just reads
-// "Expanded" instead of "Selection Expanded"
-
-// TODO sometimes screenreader reads too much (e.g. "File, expanded, opens menu, expanded")
-
-// TODO don't focus on separators
-
-// TODO don't focus on hover
-// only focus on hover when it has already focus or the menu has focus
-
-// TODO title bar menu bar is very inefficient:
-
-// before: 5 times recalculate style
-// 1.37ms Recalculate style
-// 83us Update Layer tree
-// 0.34ms paint
-// 0.79ms composite layer
-// 0.23ms Hit test
-// 1.42ms Recalculate style
-// 1.44ms Recalculate style
-// 2.08ms Recalculate style
-// 0.44ms Recalculate style
-// 0.52ms Layout
-// 0.16ms Update Layer Tree
-// 48us hit test
-// 16us Update Layer Tree
-// 0.36ms paint
-// 0.33ms composite layer
-
-// now: 2 recalculate styles
-// 0.43ms recalculate style
-// 0.53ms recalculate style
-// 0.19ms layout
-// 0.16ms update layer tree
-// 30us hit test
-// 17us update layer tree
-// 0.17ms paint
-// 0.19ms composite layers
-
-const setFocusedIndex = (state, unFocusIndex, focusIndex, oldIsMenuOpen, newIsMenuOpen) => {
-  object(state);
-  number(unFocusIndex);
-  number(focusIndex);
-  const {
-    $Viewlet
-  } = state;
-  if (focusIndex !== -1) {
-    $Viewlet.focus();
-    $Viewlet.setAttribute(AriaActiveDescendant, activeId);
-  }
-};
-
-// TODO the focus variable is confusing: false means keep focus in menubar, true means focus the menu
-const openMenu = (state, unFocusIndex, index, level, menuItems, menuFocusedIndex, focus, x, y, width, height) => {
-  object(state);
-  number(unFocusIndex);
-  number(index);
-  number(level);
-  array(menuItems);
-  number(menuFocusedIndex);
-  boolean(focus);
-  number(x);
-  number(y);
-  number(width);
-  number(height);
-  const {
-    $Viewlet
-  } = state;
-  // TODO this code is very unclean
-  $Viewlet.addEventListener('mouseenter', handlePointerOver, {
-    capture: true
-  });
-  if (unFocusIndex !== -1) {
-    $Viewlet.children[unFocusIndex].ariaExpanded = False;
-    $Viewlet.children[unFocusIndex].removeAttribute(AriaOwns);
-  }
-  $Viewlet.children[index].ariaExpanded = True;
-  const $$Menus = state$3.$$Menus;
-  state$3.$$Menus = [];
-  // @ts-expect-error
-  showControlled({
-    $Parent: $Viewlet.children[index],
-    handleFocusOut: handleFocusOut,
-    height,
-    items: menuItems,
-    level,
-    width,
-    x,
-    y
-  });
-  if (menuFocusedIndex !== -1) {
-    focusIndex(0, -1, menuFocusedIndex);
-  }
-  for (const $Menu of $$Menus) {
-    remove$1($Menu);
-  }
-};
-
-// TODO there need to be two variants of closeMenu: one just closes menu, another close menu and focuses top level entry
-const closeMenu = (state, unFocusIndex, index) => {
-  const {
-    $Viewlet
-  } = state;
-  if (unFocusIndex !== -1) {
-    $Viewlet.children[unFocusIndex].ariaExpanded = False;
-    $Viewlet.children[unFocusIndex].removeAttribute(AriaOwns);
-  }
-  if (index !== -1) {
-    $Viewlet.children[index].focus();
-  }
-  hide(/* restoreFocus */false);
-  $Viewlet.removeEventListener('mouseenter', handlePointerOver, {
-    capture: true
-  });
-};
-const create$Menu = () => {
-  const $Menu = document.createElement('div');
-  $Menu.className = 'Menu';
-  $Menu.role = Menu;
-  $Menu.tabIndex = -1;
-  // $ContextMenu.onmousedown = contextMenuHandleMouseDown
-  // TODO mousedown vs click? (click is usually better but mousedown is faster, why wait 100ms?)
-  // $Menu.addEventListener('mousedown', handleMouseDown)
-  // $Menu.addEventListener('mouseenter', handleMouseEnter, {
-  //   capture: true,
-  // })
-  // $Menu.addEventListener('mouseleave', handleMouseLeave, {
-  //   capture: true,
-  // })
-  // $Menu.addEventListener('mousemove', handleMouseMove, {
-  //   passive: true,
-  // })
-  // $Menu.onkeydown = handleKeyDown
-  // $Menu.addEventListener('focusout', handleFocusOut)
-  // $Menu.oncontextmenu = handleContextMenu
-  // $ContextMenu.onfocus = handleFocus
-  // $ContextMenu.onblur = handleBlur
-  return $Menu;
-};
-
-// TODO recycle menus
-const setMenus = (state, changes, uid) => {
-  array(changes);
-  number(uid);
-  state.$$Menus ||= [];
-  const {
-    $$Menus
-  } = state;
-  for (const change of changes) {
-    const type = change[0];
-    switch (type) {
-      case 'addMenu':
-        {
-          const menu = change[1];
-          const dom = change[2];
-          const $Menu = create$Menu();
-          set$3($Menu, uid);
-          $Menu.onmouseover = handleMenuMouseOver;
-          $Menu.onclick = handleMenuClick;
-          const {
-            focusedIndex,
-            height,
-            level,
-            width,
-            x,
-            y
-          } = menu;
-          setBounds$a($Menu, x, y, width, height);
-          renderInto($Menu, dom);
-          $Menu.id = `Menu-${level}`;
-          append$1($Menu);
-          if (focusedIndex !== -1) {
-            const $Child = $Menu.children[focusedIndex];
-            // @ts-expect-error
-            $Child.focus();
-          }
-          $$Menus.push($Menu);
-          break;
-        }
-      case 'closeMenus':
-        {
-          const keepCount = change[1];
-          const $$ToDispose = $$Menus.slice(keepCount);
-          for (const $ToDispose of $$ToDispose) {
-            remove$1($ToDispose);
-          }
-          $$Menus.length = keepCount;
-          break;
-        }
-      case 'updateMenu':
-        {
-          const menu = change[1];
-          const newLength = change[2];
-          const dom = change[3];
-          const {
-            focusedIndex,
-            height,
-            level,
-            width,
-            x,
-            y
-          } = menu;
-          const $Menu = $$Menus[level];
-          setBounds$a($Menu, x, y, width, height);
-          renderInto($Menu, dom);
-          if (level === newLength - 1) {
-            if (focusedIndex === -1) {
-              $Menu.focus();
-            } else {
-              const $Child = $Menu.children[focusedIndex];
-              $Child.focus();
-            }
-          }
-          break;
-        }
-      // No default
-    }
-  }
-};
-
-const ViewletTitleBarMenuBar = {
-  __proto__: null,
-  Events: ViewletTitleBarMenuBarEvents,
-  closeMenu,
-  dispose: dispose$4,
-  focus: focus$2,
-  openMenu,
-  setFocusedIndex,
-  setMenus
-};
-
-const activeClassName = 'TitleBarActive';
-const setFocused = (state, isFocused) => {
-  const {
-    $Viewlet
-  } = state;
-  $Viewlet.classList.toggle(activeClassName, isFocused);
-};
-
-const ViewletTitleBar = {
-  __proto__: null,
-  Events: ViewletTitleBarMenuBarEvents,
-  closeMenu,
-  dispose: dispose$4,
-  focus: focus$2,
-  openMenu,
-  setFocused,
-  setFocusedIndex,
-  setMenus
-};
-
-/**
- *
- * @param {MouseEvent} event
- */
-const handleTitleBarButtonsClick = event => {
-  const {
-    target
-  } = event;
-  return ['handleClick', target.className];
-};
-const returnValue$1 = true;
-
-const ViewletTitleBarButtonsEvents = {
-  __proto__: null,
-  handleTitleBarButtonsClick,
-  returnValue: returnValue$1
-};
-
-const ViewletTitleBarButtons = {
-  __proto__: null,
-  Events: ViewletTitleBarButtonsEvents
-};
-
-const Events = {};
-
-const ViewletTitleBarIcon = {
-  __proto__: null,
-  Events
-};
-
-const create$4 = () => {
-  const $Viewlet = document.createElement('div');
-  $Viewlet.className = 'Viewlet TitleBarTitle';
-  return {
-    $Viewlet
-  };
-};
-const setDom$1 = (state, dom) => {
-  const {
-    $Viewlet
-  } = state;
-  renderInto($Viewlet, dom);
-};
-
-const ViewletTitleBarTitle = {
   __proto__: null,
   create: create$4,
-  setDom: setDom$1
+  setTabsDom
 };
 
 const handleVideoError$1 = (code, message) => {
@@ -8968,10 +8235,6 @@ const load$1 = moduleId => {
       return ViewletKeyBindings;
     case Layout:
       return ViewletLayout;
-    case Main:
-      return ViewletMain;
-    case MainTabs:
-      return ViewletMainTabs;
     case Output:
       return ViewletOutput;
     case Panel:
@@ -8996,16 +8259,6 @@ const load$1 = moduleId => {
       return Promise.resolve().then(function () { return ViewletTerminal; });
     case Terminals:
       return ViewletTerminals;
-    case TitleBar:
-      return ViewletTitleBar;
-    case TitleBarButtons:
-      return ViewletTitleBarButtons;
-    case TitleBarIcon:
-      return ViewletTitleBarIcon;
-    case TitleBarMenuBar:
-      return ViewletTitleBarMenuBar;
-    case TitleBarTitle:
-      return ViewletTitleBarTitle;
     case Video:
       return ViewletVideo;
     case WebView:
@@ -9909,7 +9162,7 @@ const commandMap = {
   'GetFilePathElectron.getFilePathElectron': getFilePathElectron,
   'HandleMessagePort.handleMessagePort': handleMessagePort,
   'InitData.getInitData': getInitData,
-  'IpcParent.create': create$z,
+  'IpcParent.create': create$w,
   'KeyBindings.setIdentifiers': setIdentifiers,
   'Layout.getBounds': getBounds,
   'Location.getHref': getHref,
@@ -9924,10 +9177,10 @@ const commandMap = {
   'Menu.showControlled': showControlled,
   'Menu.showMenu': showMenu,
   'Meta.setThemeColor': setThemeColor,
-  'Notification.create': create$y,
+  'Notification.create': create$v,
   'Notification.createWithOptions': createWithOptions,
-  'Notification.dispose': dispose$i,
-  'OffscreenCanvas.create': create$x,
+  'Notification.dispose': dispose$g,
+  'OffscreenCanvas.create': create$u,
   'OffscreenCanvas.create2': create2,
   'Open.openUrl': openUrl,
   'Performance.getMemory': getMemory,
@@ -9988,7 +9241,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$z({
+  const ipc = await create$w({
     method: ModuleWorkerWithMessagePort,
     name: 'Editor Worker',
     port,
@@ -10016,7 +9269,7 @@ const extensionHostWorkerUrl = getConfiguredExtensionHostWorkerUrl() || `${asset
 
 const launchExtensionHostWorker = async port => {
   const name = isElectron ? 'Extension Host (Electron)' : 'Extension Host';
-  const ipc = await create$z({
+  const ipc = await create$w({
     method: ModuleWorkerWithMessagePort,
     name,
     port,
@@ -10044,7 +9297,7 @@ const getConfiguredSyntaxHighlightingWorkerUrl = () => {
 const syntaxHighlightingWorkerUrl = getConfiguredSyntaxHighlightingWorkerUrl() || `${assetDir}/packages/renderer-worker/node_modules/@lvce-editor/syntax-highlighting-worker/dist/syntaxHighlightingWorkerMain.js`;
 
 const launchSyntaxHighlightingWorker = async port => {
-  const ipc = await create$z({
+  const ipc = await create$w({
     method: ModuleWorkerWithMessagePort,
     name: 'Syntax Highlighting Worker',
     port,
@@ -10077,7 +9330,7 @@ const launchWorkers = () => {
 const handleFocusIn = event => {
   preventDefault(event);
   const uid = fromEvent(event);
-  handleFocusIn$4(uid);
+  handleFocusIn$3(uid);
 };
 const handleBlur$1 = event => {
   const uid = fromEvent(event);
@@ -10440,7 +9693,6 @@ const main = async () => {
   state$1.modules[EditorRename] = ViewletEditorRename;
   state$1.modules[EditorSourceActions] = ViewletEditorSourceActions;
   state$1.modules[FindWidget] = ViewletFindWidget;
-  state$1.modules[TitleBar] = ViewletTitleBar;
   // TODO this is discovered very late
   await launchWorkers();
   setIpc(RendererWorker);