@lvce-editor/renderer-process 10.5.0 → 10.6.0

package/dist/rendererProcessMain.js

@@ -739,7 +739,7 @@ const getErrorResponse = (message, error, preparePrettyError, logError) => {
   const errorProperty = getErrorProperty(error, prettyError);
   return create$1$1(message, errorProperty);
 };
-const create$N = (message, result) => {
+const create$M = (message, result) => {
   return {
     jsonrpc: Two,
     id: message.id,
@@ -748,7 +748,7 @@ const create$N = (message, result) => {
 };
 const getSuccessResponse = (message, result) => {
   const resultProperty = result ?? null;
-  return create$N(message, resultProperty);
+  return create$M(message, resultProperty);
 };
 const getResponse = async (message, ipc, execute, preparePrettyError, logError, requiresSocket) => {
   try {
@@ -923,7 +923,7 @@ const launchWorker = async ({
   name,
   url
 }) => {
-  const worker = await create$M({
+  const worker = await create$L({
     method: Auto,
     url,
     name
@@ -1030,7 +1030,7 @@ const RendererWorker = {
   state: state$9
 };
 
-const create$M = async ({
+const create$L = async ({
   method,
   ...options
 }) => {
@@ -1051,7 +1051,7 @@ const create$M = async ({
 };
 
 const launchEditorWorker = async port => {
-  const ipc = await create$M({
+  const ipc = await create$L({
     name: 'Editor Worker',
     url: editorWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -1081,7 +1081,7 @@ const extensionHostWorkerUrl = getConfiguredExtensionHostWorkerUrl() || `${asset
 
 const launchExtensionHostWorker = async port => {
   const name = isElectron ? 'Extension Host (Electron)' : 'Extension Host';
-  const ipc = await create$M({
+  const ipc = await create$L({
     name,
     url: extensionHostWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -1105,7 +1105,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$M({
+  const ipc = await create$L({
     name: 'Syntax Highlighting Worker',
     url: syntaxHighlightingWorkerUrl,
     method: ModuleWorkerWithMessagePort,
@@ -1831,7 +1831,7 @@ const stopTracking$1 = ($Target, pointerId, handlePointerMove, handlePointerUp)
   // TODO use pointerlost event instead
   $Target.removeEventListener(PointerUp, handlePointerUp);
 };
-const create$L = (pointerDown, pointerMove, pointerUp) => {
+const create$K = (pointerDown, pointerMove, pointerUp) => {
   const shared = (fn, event) => {
     const message = fn(event);
     if (!message || message.length === 0) {
@@ -1864,7 +1864,7 @@ const create$L = (pointerDown, pointerMove, pointerUp) => {
 };
 
 const handleOffset = 20;
-const handleSliderPointerDown = create$L(event => {
+const handleSliderPointerDown = create$K(event => {
   const {
     clientX,
     clientY
@@ -1920,7 +1920,7 @@ const applyUidWorkaround = element => {
   const editorUid = get$6(editor);
   set$5(element, editorUid);
 };
-const appendWidget$1 = state => {
+const appendWidget$2 = state => {
   const {
     $Viewlet
   } = state;
@@ -1930,7 +1930,7 @@ const appendWidget$1 = state => {
 const ViewletColorPicker = {
   __proto__: null,
   Events: ViewletColorPickerEvents,
-  appendWidget: appendWidget$1,
+  appendWidget: appendWidget$2,
   setColor,
   setOffsetX
 };
@@ -1954,7 +1954,7 @@ const ToolBar = 'toolbar';
 const Tree = 'tree';
 const ComboBox = 'combobox';
 
-const attachEvents$d = ($Node, eventMap) => {
+const attachEvents$c = ($Node, eventMap) => {
   for (const [key, value] of Object.entries(eventMap)) {
     $Node.addEventListener(key, value);
   }
@@ -2273,7 +2273,7 @@ const setNegativeMargin = (state, negativeMargin) => {
   setTop($ListItems, negativeMargin);
 };
 
-const create$K = () => {
+const create$J = () => {
   const $ListItems = document.createElement('div');
   $ListItems.className = 'ListItems';
   $ListItems.role = ListBox;
@@ -2297,24 +2297,24 @@ const create$K = () => {
     $ScrollBarThumb
   };
 };
-const attachEvents$c = state => {
+const attachEvents$b = state => {
   const {
     $Viewlet,
     $ListItems,
     $ScrollBar
   } = state;
   $Viewlet.addEventListener(Wheel, handleWheel$3, Passive);
-  attachEvents$d($ListItems, {
+  attachEvents$c($ListItems, {
     [MouseDown]: handleMousedown
   });
-  attachEvents$d($ScrollBar, {
+  attachEvents$c($ScrollBar, {
     [PointerDown]: handleScrollBarPointerDown$4
   });
 };
 // 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$b = (state, dom) => {
+const setDom$a = (state, dom) => {
   const {
     $ListItems,
     $Viewlet
@@ -2355,13 +2355,13 @@ const setBounds$6 = (state, x, y, width, height) => {
 
 const ViewletEditorCompletion = {
   __proto__: null,
-  attachEvents: attachEvents$c,
-  create: create$K,
+  attachEvents: attachEvents$b,
+  create: create$J,
   dispose: dispose$k,
   handleError: handleError$8,
   setBounds: setBounds$6,
   setContentHeight,
-  setDom: setDom$b,
+  setDom: setDom$a,
   setNegativeMargin,
   setScrollBar: setScrollBar$2,
   setSize,
@@ -2379,7 +2379,7 @@ const ViewletEditorCompletionDetailsEvents = {
   returnValue: returnValue$9
 };
 
-const create$J = () => {
+const create$I = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorCompletionDetails';
   $Viewlet.id = 'CompletionsDetails';
@@ -2387,10 +2387,10 @@ const create$J = () => {
     $Viewlet
   };
 };
-const attachEvents$b = state => {
+const attachEvents$a = state => {
   // TODO
 };
-const setDom$a = (state, dom) => {
+const setDom$9 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -2399,7 +2399,7 @@ const setDom$a = (state, dom) => {
   $Viewlet.replaceChildren(...$Root.firstChild.childNodes);
   append$1($Viewlet);
 };
-const appendWidget = state => {
+const appendWidget$1 = state => {
   const {
     $Viewlet
   } = state;
@@ -2418,12 +2418,130 @@ const setBounds$5 = (state, x, y, width, height) => {
 const ViewletEditorCompletionDetails = {
   __proto__: null,
   Events: ViewletEditorCompletionDetailsEvents,
-  appendWidget,
-  attachEvents: attachEvents$b,
-  create: create$J,
+  appendWidget: appendWidget$1,
+  attachEvents: attachEvents$a,
+  create: create$I,
   dispose: dispose$j,
   setBounds: setBounds$5,
-  setDom: setDom$a
+  setDom: setDom$9
+};
+
+const rememberFocus = rememberFocus$1;
+
+const handleInput$7 = event => {
+  const {
+    target
+  } = event;
+  const {
+    value
+  } = target;
+  const uid = fromEvent(event);
+  handleInput$8(uid, value);
+};
+const handleClickClose$2 = (uid, event) => {
+  preventDefault(event);
+  close$1(uid);
+};
+const handleClickPreviousMatch = (uid, event) => {
+  preventDefault(event);
+  focusPrevious$1(uid);
+};
+const handleClickNextMatch = (uid, event) => {
+  preventDefault(event);
+  focusNext(uid);
+};
+const handleClickToggleReplace = (uid, event) => {
+  preventDefault(event);
+  toggleReplace(uid);
+};
+const handleClick$8 = event => {
+  const {
+    target
+  } = event;
+  const {
+    title
+  } = target;
+  const uid = fromEvent(event);
+  switch (title) {
+    case 'Close':
+      handleClickClose$2(uid, event);
+      break;
+    case 'Previous Match':
+      handleClickPreviousMatch(uid, event);
+      break;
+    case 'Next Match':
+      handleClickNextMatch(uid, event);
+      break;
+    case 'Toggle Replace':
+      handleClickToggleReplace(uid, event);
+      break;
+  }
+};
+const handleInputBlur = event => {
+  const uid = fromEvent(event);
+  handleBlur$a(uid);
+};
+const handleFocus$b = event => {
+  const uid = fromEvent(event);
+  handleFocus$c(uid);
+};
+
+const ViewletFindWidgetEvents = {
+  __proto__: null,
+  handleClick: handleClick$8,
+  handleFocus: handleFocus$b,
+  handleInput: handleInput$7,
+  handleInputBlur
+};
+
+const create$H = () => {
+  const $Viewlet = document.createElement('div');
+  $Viewlet.className = 'Viewlet FindWidget';
+  $Viewlet.role = Group;
+  return {
+    $Viewlet
+  };
+};
+const focus$i = state => {
+  const {
+    $Viewlet
+  } = state;
+  const $InputBox = $Viewlet.querySelector('.MultilineInputBox');
+  if (!$InputBox) {
+    return;
+  }
+  $InputBox.focus();
+};
+const setValue$4 = (state, value) => {
+  const {
+    $Viewlet
+  } = state;
+  const $InputBox = $Viewlet.querySelector('.MultilineInputBox');
+  if (!$InputBox) {
+    return;
+  }
+  $InputBox.value = value;
+};
+const appendWidget = state => {
+  const {
+    $Viewlet
+  } = state;
+  append$1($Viewlet);
+};
+const setDom$8 = (state, dom) => {
+  const {
+    $Viewlet
+  } = state;
+  rememberFocus($Viewlet, dom, ViewletFindWidgetEvents, 0);
+};
+
+const ViewletFindWidget = {
+  __proto__: null,
+  appendWidget,
+  create: create$H,
+  focus: focus$i,
+  setDom: setDom$8,
+  setValue: setValue$4
 };
 
 const ActivityBar = 'ActivityBar';
@@ -2828,6 +2946,7 @@ const main = async () => {
   state$6.modules[EditorCompletion] = ViewletEditorCompletion;
   state$6.modules[EditorCompletionDetails] = ViewletEditorCompletionDetails;
   state$6.modules[ColorPicker] = ViewletColorPicker;
+  state$6.modules[FindWidget] = ViewletFindWidget;
   setLoad(load$2);
   // TODO this is discovered very late
   await launchWorkers();
@@ -2921,7 +3040,7 @@ ${relevant}`;
 
 const Module = 'module';
 
-const create$I = async ({
+const create$G = async ({
   url,
   name
 }) => {
@@ -2987,7 +3106,7 @@ const wrap = worker => {
 
 const IpcParentWithModuleWorker = {
   __proto__: null,
-  create: create$I,
+  create: create$G,
   wrap
 };
 
@@ -2995,7 +3114,7 @@ const isMessagePort$1 = value => {
   return value instanceof MessagePort;
 };
 
-const create$H = async ({
+const create$F = async ({
   url
 }) => {
   string(url);
@@ -3016,10 +3135,10 @@ const create$H = async ({
 
 const IpcParentWithMessagePort = {
   __proto__: null,
-  create: create$H
+  create: create$F
 };
 
-const create$G = async url => {
+const create$E = async url => {
   const referencePort = await new Promise(resolve => {
     globalThis.acceptReferencePort = resolve;
     import(url);
@@ -3030,7 +3149,7 @@ const create$G = async url => {
 
 const IpcParentWithReferencePort = {
   __proto__: null,
-  create: create$G
+  create: create$E
 };
 
 const isWorker = value => {
@@ -3038,12 +3157,12 @@ const isWorker = value => {
 };
 
 // TODO add test
-const create$F = async ({
+const create$D = async ({
   url,
   name,
   port
 }) => {
-  const worker = await create$I({
+  const worker = await create$G({
     url,
     name
   });
@@ -3062,7 +3181,7 @@ const create$F = async ({
 
 const IpcParentWithModuleWorkerWithMessagePort = {
   __proto__: null,
-  create: create$F
+  create: create$D
 };
 
 const handleIpcOnce = ipc => {
@@ -3129,7 +3248,7 @@ const getTransferrables = value => {
   walkValue(value, transferrables, isTransferrable);
   return transferrables;
 };
-const attachEvents$a = that => {
+const attachEvents$9 = that => {
   const handleMessage = (...args) => {
     const data = that.getData(...args);
     that.dispatchEvent(new MessageEvent('message', {
@@ -3146,7 +3265,7 @@ class Ipc extends EventTarget {
   constructor(rawIpc) {
     super();
     this._rawIpc = rawIpc;
-    attachEvents$a(this);
+    attachEvents$9(this);
   }
 }
 const readyMessage = 'ready';
@@ -3593,7 +3712,7 @@ const IpcChildWithMessagePort$1 = {
 };
 
 // TODO use handleIncomingIpc function
-const create$E = async ({
+const create$C = async ({
   port,
   ipcId
 }) => {
@@ -3609,7 +3728,7 @@ const create$E = async ({
 
 const IpcParentWithElectron = {
   __proto__: null,
-  create: create$E
+  create: create$C
 };
 
 const play = async src => {
@@ -3840,7 +3959,7 @@ const AriaAlert = {
 // but that's difficult to know
 
 // TODO hide widget after timeout or mousemove
-const create$D = (message, x, y) => {
+const create$B = (message, x, y) => {
   const $EditorError = document.createElement('div');
   $EditorError.className = 'EditorWidgetError';
   $EditorError.textContent = message;
@@ -3855,7 +3974,7 @@ const create$D = (message, x, y) => {
 
 const name$t = 'EditorError';
 const Commands$u = {
-  create: create$D
+  create: create$B
 };
 
 const EditorError_ipc = {
@@ -3878,7 +3997,7 @@ const getElement = () => {
   return state$3.$PreviousFocusElement;
 };
 
-const focus$i = $Element => {
+const focus$h = $Element => {
   if ($Element === document.activeElement) {
     return;
   }
@@ -3895,7 +4014,7 @@ const focusPrevious = () => {
   }
 };
 
-const create$C = () => {
+const create$A = () => {
   const $InputBox = document.createElement('input');
   $InputBox.className = 'InputBox';
   $InputBox.spellcheck = false;
@@ -3919,8 +4038,8 @@ const FocusOutput = 28;
 const handleBlur$9 = () => {
   send(/* EditorRename.abort */'EditorRename.abort');
 };
-const create$B = (x, y) => {
-  const $RenameWidgetInputBox = create$C();
+const create$z = (x, y) => {
+  const $RenameWidgetInputBox = create$A();
   $RenameWidgetInputBox.className = 'RenameWidgetInputBox';
   $RenameWidgetInputBox.onblur = handleBlur$9;
   const $RenameWidget = document.createElement('div');
@@ -3928,7 +4047,7 @@ const create$B = (x, y) => {
   $RenameWidget.append($RenameWidgetInputBox);
   setXAndY($RenameWidget, x, y);
   append$1($RenameWidget);
-  focus$i($RenameWidgetInputBox);
+  focus$h($RenameWidgetInputBox);
   send('Focus.setFocus', FocusEditorRename);
   return {
     $RenameWidget,
@@ -3951,7 +4070,7 @@ const finish = state => {
 
 const name$s = 'EditorRename';
 const Commands$t = {
-  create: create$B,
+  create: create$z,
   dispose: dispose$i,
   finish: finish
 };
@@ -4037,7 +4156,7 @@ const showError = (message, y, x) => {
     $ImagePreviewImage
   };
 };
-const create$A = (uri, top, left) => {
+const create$y = (uri, top, left) => {
   const $ImagePreviewImage = document.createElement('img');
   $ImagePreviewImage.className = 'ImagePreviewImage';
   $ImagePreviewImage.src = uri;
@@ -4068,7 +4187,7 @@ const dispose$h = state => {
 
 const ImagePreview = {
   __proto__: null,
-  create: create$A,
+  create: create$y,
   dispose: dispose$h,
   showError,
   update
@@ -4076,7 +4195,7 @@ const ImagePreview = {
 
 const name$p = 'ImagePreview';
 const Commands$q = {
-  create: create$A,
+  create: create$y,
   dispose: dispose$h,
   showError: showError,
   update: update
@@ -4154,7 +4273,7 @@ const InitData_ipc = {
 
 const name$n = 'IpcParent';
 const Commands$o = {
-  create: create$M
+  create: create$L
 };
 
 const IpcParent_ipc = {
@@ -4274,7 +4393,7 @@ const create$Notification = message => {
   $Notification.textContent = message;
   return $Notification;
 };
-const create$z = (type, message) => {
+const create$x = (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);
@@ -4327,7 +4446,7 @@ const name$h = 'Notification';
 
 // prettier-ignore
 const Commands$i = {
-  create: create$z,
+  create: create$x,
   createWithOptions: createWithOptions,
   dispose: dispose$g
 };
@@ -4351,7 +4470,7 @@ const set$3 = (canvasId, canvas) => {
 const get$3 = id => {
   return get$4(id);
 };
-const create$y = async (canvasId, objectId) => {
+const create$w = async (canvasId, objectId) => {
   const canvas = document.createElement('canvas');
   const offscreenCanvas = canvas.transferControlToOffscreen();
   set$3(canvasId, canvas);
@@ -4362,7 +4481,7 @@ const name$g = 'OffscreenCanvas';
 
 // prettier-ignore
 const Commands$h = {
-  create: create$y
+  create: create$w
 };
 
 const OffscreenCanvas_ipc = {
@@ -4583,7 +4702,7 @@ const showMenu = (x, y, width, height, items, level, parentIndex = -1, dom, mous
   state$1.$$Menus.push($Menu);
   append$1($Menu);
   if (level === 0) {
-    focus$i($Menu);
+    focus$h($Menu);
     send('Focus.setFocus', FocusMenu);
   }
 };
@@ -5409,8 +5528,6 @@ const setIdentifiers = identifiers => {
   setIdentifiers$1(identifiers);
 };
 
-const rememberFocus = rememberFocus$1;
-
 const load$1 = moduleId => {
   switch (moduleId) {
     case ImagePreview$1:
@@ -5532,7 +5649,7 @@ const load$1 = moduleId => {
   }
 };
 
-const create$x = (id, uid = id) => {
+const create$v = (id, uid = id) => {
   const module = state$6.modules[id];
   if (!module) {
     throw new Error(`module not found: ${id}`);
@@ -5597,7 +5714,7 @@ const invoke = (viewletId, method, ...args) => {
   }
   return instance.factory[method](instance.state, ...args);
 };
-const focus$h = viewletId => {
+const focus$g = viewletId => {
   const instance = state$6.instances[viewletId];
   if (instance.factory?.setFocused) {
     instance.factory.setFocused(instance.state, true);
@@ -5652,7 +5769,7 @@ const createPlaceholder = (viewletId, parentId, top, left, width, height) => {
     }
   };
 };
-const setDom$9 = (viewletId, dom) => {
+const setDom$7 = (viewletId, dom) => {
   const instance = state$6.instances[viewletId];
   if (!instance) {
     return;
@@ -5699,7 +5816,7 @@ const sendMultiple = commands => {
         }
       case 'Viewlet.create':
         {
-          create$x(viewletId, method);
+          create$v(viewletId, method);
           break;
         }
       case 'Viewlet.createFunctionalRoot':
@@ -5733,7 +5850,7 @@ const sendMultiple = commands => {
         }
       case 'Viewlet.focus':
         {
-          focus$h(viewletId);
+          focus$g(viewletId);
           break;
         }
       case 'Viewlet.appendViewlet':
@@ -5753,7 +5870,7 @@ const sendMultiple = commands => {
         break;
       case 'Viewlet.setDom':
         // @ts-expect-error
-        setDom$9(viewletId, method, ...args);
+        setDom$7(viewletId, method, ...args);
         break;
       case 'Viewlet.setDom2':
         // @ts-ignore
@@ -5894,7 +6011,7 @@ const appendToBody = childId => {
 const getFn = command => {
   switch (command) {
     case 'Viewlet.create':
-      return create$x;
+      return create$v;
     case 'Viewlet.send':
       return invoke;
     case 'Viewlet.show':
@@ -5914,13 +6031,13 @@ const getFn = command => {
     case 'Viewlet.createPlaceholder':
       return createPlaceholder;
     case 'Viewlet.focus':
-      return focus$h;
+      return focus$g;
     case 'Viewlet.appendViewlet':
       return appendViewlet;
     case 'Viewlet.addKeyBindings':
       return addKeyBindings;
     case 'Viewlet.setDom':
-      return setDom$9;
+      return setDom$7;
     case 'Viewlet.createFunctionalRoot':
       return createFunctionalRoot;
     default:
@@ -5959,7 +6076,7 @@ const Commands$9 = {
   appendViewlet: appendViewlet,
   dispose: dispose$e,
   executeCommands: executeCommands,
-  focus: focus$h,
+  focus: focus$g,
   focusSelector: focusSelector,
   handleError: handleError$6,
   invoke: invoke,
@@ -6240,7 +6357,7 @@ const waitForFrameToLoad = $Frame => {
 };
 
 // TODO could use browser view when running in electron
-const create$w = async (uid, src, sandbox, csp, credentialless) => {
+const create$u = async (uid, src, sandbox, csp, credentialless) => {
   const $Iframe = document.createElement('iframe');
   setIframeCredentialless($Iframe, credentialless);
   setIframeCsp($Iframe, csp);
@@ -6282,7 +6399,7 @@ const dispose$d = uid => {
 
 const name = 'WebView';
 const Commands$1 = {
-  create: create$w,
+  create: create$u,
   load: load,
   setPort: setPort$2,
   dispose: dispose$d
@@ -6330,7 +6447,7 @@ const handleMouseDown$2 = event => {
 const handleBlur$8 = () => {
   return ['handleBlur'];
 };
-const handleFocus$b = () => {
+const handleFocus$a = () => {
   return ['handleFocus'];
 };
 
@@ -6351,16 +6468,16 @@ const ViewletActivityBarEvents = {
   __proto__: null,
   handleBlur: handleBlur$8,
   handleContextMenu: handleContextMenu$b,
-  handleFocus: handleFocus$b,
+  handleFocus: handleFocus$a,
   handleMouseDown: handleMouseDown$2,
   returnValue: returnValue$8
 };
 
-const Events$a = ViewletActivityBarEvents;
+const Events$b = ViewletActivityBarEvents;
 
 const ViewletActivityBar = {
   __proto__: null,
-  Events: Events$a
+  Events: Events$b
 };
 
 const handleAudioError = event => {
@@ -6383,21 +6500,21 @@ const ViewletAudioEvents = {
   handleAudioError
 };
 
-const Events$9 = ViewletAudioEvents;
+const Events$a = ViewletAudioEvents;
 
 const ViewletAudio = {
   __proto__: null,
-  Events: Events$9
+  Events: Events$a
 };
 
-const create$v = () => {
+const create$t = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet BrowserViewOverview';
   return {
     $Viewlet
   };
 };
-const setDom$8 = (state, dom) => {
+const setDom$6 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -6406,11 +6523,11 @@ const setDom$8 = (state, dom) => {
 
 const ViewletBrowserViewOverview = {
   __proto__: null,
-  create: create$v,
-  setDom: setDom$8
+  create: create$t,
+  setDom: setDom$6
 };
 
-const create$u = () => {
+const create$s = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Clock';
   return {
@@ -6427,13 +6544,13 @@ const setTime = (state, time) => {
 
 const ViewletClock = {
   __proto__: null,
-  create: create$u,
+  create: create$s,
   dispose: dispose$c,
   refresh: refresh$3,
   setTime
 };
 
-const handleInput$7 = event => {
+const handleInput$6 = event => {
   const uid = fromEvent(event);
   const {
     target
@@ -6443,25 +6560,25 @@ const handleInput$7 = event => {
   } = target;
   handleInput$8(uid, value);
 };
-const handleFocus$a = event => {
+const handleFocus$9 = event => {
   const uid = fromEvent(event);
   handleFocus$c(uid);
 };
 
 const ViewletDebugConsoleEvents = {
   __proto__: null,
-  handleFocus: handleFocus$a,
-  handleInput: handleInput$7
+  handleFocus: handleFocus$9,
+  handleInput: handleInput$6
 };
 
-const create$t = () => {
+const create$r = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet DebugConsole';
   return {
     $Viewlet
   };
 };
-const setDom$7 = (state, dom) => {
+const setDom$5 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -6470,8 +6587,8 @@ const setDom$7 = (state, dom) => {
 
 const ViewletDebugConsole = {
   __proto__: null,
-  create: create$t,
-  setDom: setDom$7
+  create: create$r,
+  setDom: setDom$5
 };
 
 const handleKeyDown$3 = event => {
@@ -6498,7 +6615,7 @@ const ViewletDefineKeyBindingEvents = {
   handleKeyDown: handleKeyDown$3
 };
 
-const setValue$4 = (state, value) => {
+const setValue$3 = (state, value) => {
   object(state);
   string(value);
   const {
@@ -6507,7 +6624,7 @@ const setValue$4 = (state, value) => {
   const $Input = $Viewlet.querySelector('input');
   $Input.value = value;
 };
-const focus$g = state => {
+const focus$f = state => {
   const {
     $Viewlet
   } = state;
@@ -6518,8 +6635,8 @@ const focus$g = state => {
 const ViewletDefineKeyBinding = {
   __proto__: null,
   Events: ViewletDefineKeyBindingEvents,
-  focus: focus$g,
-  setValue: setValue$4
+  focus: focus$f,
+  setValue: setValue$3
 };
 
 const setMaskImage = ($Element, icon) => {
@@ -6531,7 +6648,7 @@ const setMaskImage = ($Element, icon) => {
   }
 };
 
-const create$s = icon => {
+const create$q = icon => {
   const $Icon = document.createElement('div');
   $Icon.className = 'MaskIcon';
   setMaskImage($Icon, icon);
@@ -6541,7 +6658,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$q(icon);
   const $Button = document.createElement('button');
   $Button.className = 'IconButton';
   $Button.title = label;
@@ -6550,19 +6667,19 @@ const create$Button = (label, icon) => {
   return $Button;
 };
 
-const handleClick$8 = index => {
+const handleClick$7 = index => {
   send(/* Dialog.handleClick */'Dialog.handleClick', /* index */index);
 };
 
-const handleClick$7 = event => {
+const handleClick$6 = event => {
   const {
     target
   } = event;
   const index = getNodeIndex(target);
-  handleClick$8(index);
+  handleClick$7(index);
 };
 
-const create$r = () => {
+const create$p = () => {
   const $DialogTitle = document.createElement('h2');
   $DialogTitle.id = 'DialogTitle';
   const $DialogCloseButton = create$Button('Close', 'Close');
@@ -6589,7 +6706,7 @@ const create$r = () => {
   $Dialog.setAttribute(AriaLabelledBy, 'DialogTitle');
   $Dialog.setAttribute(AriaDescribedBy, 'DialogBodyErrorMessage');
   $Dialog.append($DialogHeader, $DialogBody);
-  $Dialog.onclick = handleClick$7;
+  $Dialog.onclick = handleClick$6;
   return {
     $Viewlet: $Dialog,
     $DialogTitle,
@@ -6643,7 +6760,7 @@ const setErrorStack = (state, errorStack) => {
 
 const ViewletDialog = {
   __proto__: null,
-  create: create$r,
+  create: create$p,
   postAppend,
   setButtons,
   setCodeFrame,
@@ -6681,14 +6798,14 @@ const ViewletDiffEditor = {
 
 // TODO aria alert
 
-const create$q = () => {
+const create$o = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorError';
   return {
     $Viewlet
   };
 };
-const setDom$6 = (state, dom) => {
+const setDom$4 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -6703,13 +6820,13 @@ const setBounds$3 = (state, x, y, width, height) => {
 
 const ViewletEditorError = {
   __proto__: null,
-  create: create$q,
+  create: create$o,
   setBounds: setBounds$3,
-  setDom: setDom$6
+  setDom: setDom$4
 };
 
 const returnValue$7 = true;
-const handleSashPointerDown$2 = create$L(event => {
+const handleSashPointerDown$2 = create$K(event => {
   const {
     clientX,
     clientY
@@ -6843,27 +6960,27 @@ const handleError$5 = event => {
   const uid = fromEvent(event);
   handleImageError$1(uid);
 };
-const handleFocus$9 = event => {
+const handleFocus$8 = event => {
   const uid = fromEvent(event);
   handleFocus$c(uid);
 };
 
-const create$p = () => {
+const create$n = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorImage';
   return {
     $Viewlet
   };
 };
-const attachEvents$9 = state => {
+const attachEvents$8 = state => {
   const {
     $Viewlet
   } = state;
-  attachEvents$d($Viewlet, {
+  attachEvents$c($Viewlet, {
     [PointerDown]: handlePointerDown$5,
     [PointerUp]: handlePointerUp,
     [ContextMenu]: handleContextMenu$a,
-    [FocusIn]: handleFocus$9
+    [FocusIn]: handleFocus$8
   });
   $Viewlet.addEventListener(Error$3, handleError$5, Capture);
   $Viewlet.addEventListener(Wheel, handleWheel$2, Passive);
@@ -6881,7 +6998,7 @@ const setDragging = (state, isDragging) => {
   } = state;
   $Viewlet.classList.toggle('Dragging', isDragging);
 };
-const setDom$5 = (state, dom) => {
+const setDom$3 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -6890,14 +7007,14 @@ const setDom$5 = (state, dom) => {
 
 const ViewletEditorImage = {
   __proto__: null,
-  attachEvents: attachEvents$9,
-  create: create$p,
-  setDom: setDom$5,
+  attachEvents: attachEvents$8,
+  create: create$n,
+  setDom: setDom$3,
   setDragging,
   setTransform
 };
 
-const create$o = () => {
+const create$m = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorText';
   $Viewlet.textContent = 'loading...';
@@ -6914,7 +7031,7 @@ const refresh$2 = (state, context) => {
 
 const ViewletEditorPlainText = {
   __proto__: null,
-  create: create$o,
+  create: create$m,
   dispose: dispose$b,
   refresh: refresh$2
 };
@@ -7033,7 +7150,7 @@ const toSimpleTouchEvent = event => {
 
 // TODO tree shake out mobile support when targeting electron -> less code -> less event listeners -> less memory -> less cpu
 
-const handleFocus$8 = event => {
+const handleFocus$7 = event => {
   return ['handleFocus'];
 };
 const handleMouseMove = event => {
@@ -7173,7 +7290,7 @@ const handlePaste = event => {
   const text = getText(clipboardData);
   return ['paste', text];
 };
-const handleScrollBarVerticalPointerDown = create$L(event => {
+const handleScrollBarVerticalPointerDown = create$K(event => {
   const {
     clientY
   } = event;
@@ -7296,7 +7413,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$l = () => {
   const $EditorInput = document.createElement('textarea');
   $EditorInput.className = 'EditorInput';
   $EditorInput.ariaAutoComplete = List;
@@ -7314,7 +7431,7 @@ const create$n = () => {
     [CompositionStart]: handleCompositionStart,
     [CompositionUpdate]: handleCompositionUpdate,
     [CompositionEnd]: handleCompositionEnd,
-    [Focus]: handleFocus$8,
+    [Focus]: handleFocus$7,
     [Blur]: handleBlur$6,
     [Cut]: handleCut,
     [Paste]: handlePaste,
@@ -7463,7 +7580,7 @@ const setDecorationsDom$1 = (state, decorations) => {
   setDecorationsDom$2(state, decorations);
 };
 
-const create$m = create$n;
+const create$k = create$l;
 const setText$1 = setText$2;
 const setSelections = setSelections$1;
 const setIncrementalEdits = setIncrementalEdits$1;
@@ -7500,13 +7617,13 @@ const hideOverlayMessage = state => {
   }
 };
 const setFocused$2 = setFocused$3;
-const focus$f = setFocused$3;
+const focus$e = setFocused$3;
 const setDecorationsDom = setDecorationsDom$1;
 
 const ViewletEditorText = {
   __proto__: null,
-  create: create$m,
-  focus: focus$f,
+  create: create$k,
+  focus: focus$e,
   handleError: handleError$4,
   hideOverlayMessage,
   highlightAsLink,
@@ -7521,7 +7638,7 @@ const ViewletEditorText = {
   showOverlayMessage
 };
 
-const create$l = () => {
+const create$j = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet EditorWidgetError EditorOverlayMessage';
   return {
@@ -7544,12 +7661,12 @@ const setBounds$1 = (state, x, y, width, height) => {
 
 const ViewletEditorWidgetError = {
   __proto__: null,
-  create: create$l,
+  create: create$j,
   setBounds: setBounds$1,
   setMessage: setMessage$2
 };
 
-const create$k = () => {
+const create$i = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.dataset.viewlet = 'Empty';
   $Viewlet.className = 'Viewlet';
@@ -7558,18 +7675,18 @@ const create$k = () => {
   };
 };
 const refresh$1 = (state, context) => {};
-const focus$e = state => {};
+const focus$d = state => {};
 const dispose$a = state => {};
 
 const ViewletEmpty = {
   __proto__: null,
-  create: create$k,
+  create: create$i,
   dispose: dispose$a,
-  focus: focus$e,
+  focus: focus$d,
   refresh: refresh$1
 };
 
-const create$j = () => {
+const create$h = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Error';
   return {
@@ -7585,7 +7702,7 @@ const setMessage$1 = (state, message) => {
 
 const ViewletError = {
   __proto__: null,
-  create: create$j,
+  create: create$h,
   setMessage: setMessage$1
 };
 
@@ -7711,7 +7828,7 @@ const handleDrop = event => {
 
 // TODO drag and drop should be loaded on demand
 
-const handleFocus$7 = event => {
+const handleFocus$6 = event => {
   const {
     target,
     isTrusted
@@ -7726,7 +7843,7 @@ const handleBlur$5 = event => {
   const uid = fromEvent(event);
   handleBlur$a(uid);
 };
-const handleClick$6 = event => {
+const handleClick$5 = event => {
   preventDefault(event);
   const {
     button,
@@ -7786,7 +7903,7 @@ const handleEditingInput = event => {
 const ViewletExplorerEvents = {
   __proto__: null,
   handleBlur: handleBlur$5,
-  handleClick: handleClick$6,
+  handleClick: handleClick$5,
   handleClickOpenFolder,
   handleContextMenu: handleContextMenu$8,
   handleDragEnd,
@@ -7795,14 +7912,14 @@ const ViewletExplorerEvents = {
   handleDragStart: handleDragStart$1,
   handleDrop,
   handleEditingInput,
-  handleFocus: handleFocus$7,
+  handleFocus: handleFocus$6,
   handleMouseEnter,
   handleMouseLeave,
   handlePointerDown: handlePointerDown$4,
   handleWheel: handleWheel$3
 };
 
-const create$i = () => {
+const create$g = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet Explorer';
   $Viewlet.tabIndex = 0;
@@ -7812,7 +7929,7 @@ const create$i = () => {
     $Viewlet
   };
 };
-const Events$8 = ViewletExplorerEvents;
+const Events$9 = ViewletExplorerEvents;
 const handleError$3 = (state, message) => {
   object(state);
   string(message);
@@ -7850,7 +7967,7 @@ const setDropTargets = (state, oldDropTargets, newDropTargets) => {
     }
   }
 };
-const setDom$4 = (state, dom) => {
+const setDom$2 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -7859,12 +7976,12 @@ const setDom$4 = (state, dom) => {
 
 const ViewletExplorer = {
   __proto__: null,
-  Events: Events$8,
-  create: create$i,
+  Events: Events$9,
+  create: create$g,
   dispose: dispose$9,
   focusInput,
   handleError: handleError$3,
-  setDom: setDom$4,
+  setDom: setDom$2,
   setDropTargets
 };
 
@@ -7903,11 +8020,11 @@ const ViewletExtensionDetailEvents = {
   handleReadmeContextMenu
 };
 
-const Events$7 = ViewletExtensionDetailEvents;
+const Events$8 = ViewletExtensionDetailEvents;
 
 const ViewletExtensionDetail = {
   __proto__: null,
-  Events: Events$7,
+  Events: Events$8,
   setSize
 };
 
@@ -7939,7 +8056,7 @@ const handleScrollBarPointerDown$2 = event => {
   const uid = fromEvent(event);
   handleScrollBarClick(uid, clientY);
 };
-const handleFocus$6 = event => {
+const handleFocus$5 = event => {
   const uid = fromEvent(event);
   handleFocus$c(uid);
 };
@@ -7956,7 +8073,7 @@ const handlePointerDown$3 = event => {
   const index = getNodeIndex($Extension);
   handleClick$9(uid, index);
 };
-const handleInput$6 = event => {
+const handleInput$5 = event => {
   const $Target = event.target;
   const value = $Target.value;
   const uid = fromEvent(event);
@@ -8008,7 +8125,7 @@ const handleTouchEnd = event => {
 
 // based on https://github.com/microsoft/vscode/blob/main/src/vs/workbench/contrib/extensions/browser/extensionsList.ts (License MIT)
 
-const create$h = () => {
+const create$f = () => {
   const $ExtensionHeader = document.createElement('div');
   $ExtensionHeader.className = 'ExtensionHeader';
 
@@ -8043,30 +8160,30 @@ const create$h = () => {
     $Message: undefined
   };
 };
-const attachEvents$8 = state => {
+const attachEvents$7 = state => {
   const {
     $ExtensionHeader,
     $ListItems,
     $ScrollBar
   } = state;
-  $ExtensionHeader.addEventListener(Input, handleInput$6, Capture);
+  $ExtensionHeader.addEventListener(Input, handleInput$5, Capture);
   // @ts-expect-error
   $ExtensionHeader.addEventListener(Click, undefined);
-  attachEvents$d($ListItems, {
+  attachEvents$c($ListItems, {
     [ContextMenu]: handleContextMenu$8,
     [PointerDown]: handlePointerDown$3,
-    [Focus]: handleFocus$6,
+    [Focus]: handleFocus$5,
     [Scroll]: handleScroll
   });
   $ListItems.addEventListener(TouchStart, handleTouchStart, Passive);
   $ListItems.addEventListener(TouchMove, handleTouchMove, Passive);
   $ListItems.addEventListener(TouchEnd, handleTouchEnd, Passive);
   $ListItems.addEventListener(Wheel, handleWheel$3, Passive);
-  attachEvents$d($ScrollBar, {
+  attachEvents$c($ScrollBar, {
     [PointerDown]: handleScrollBarPointerDown$2
   });
 };
-const focus$d = state => {
+const focus$c = state => {
   object(state);
   state.$InputBox.focus();
 };
@@ -8151,11 +8268,11 @@ const setSearchValue = (state, oldValue, newValue) => {
 
 const ViewletExtensions = {
   __proto__: null,
-  attachEvents: attachEvents$8,
+  attachEvents: attachEvents$7,
   closeSuggest,
-  create: create$h,
+  create: create$f,
   dispose: dispose$8,
-  focus: focus$d,
+  focus: focus$c,
   handleError: handleError$2,
   openSuggest,
   setContentHeight,
@@ -8169,115 +8286,6 @@ const ViewletExtensions = {
   setSize
 };
 
-const handleInput$5 = event => {
-  const {
-    target
-  } = event;
-  const {
-    value
-  } = target;
-  const uid = fromEvent(event);
-  handleInput$8(uid, value);
-};
-const handleClickClose$2 = (uid, event) => {
-  preventDefault(event);
-  close$1(uid);
-};
-const handleClickPreviousMatch = (uid, event) => {
-  preventDefault(event);
-  focusPrevious$1(uid);
-};
-const handleClickNextMatch = (uid, event) => {
-  preventDefault(event);
-  focusNext(uid);
-};
-const handleClickToggleReplace = (uid, event) => {
-  preventDefault(event);
-  toggleReplace(uid);
-};
-const handleClick$5 = event => {
-  const {
-    target
-  } = event;
-  const {
-    title
-  } = target;
-  const uid = fromEvent(event);
-  switch (title) {
-    case 'Close':
-      handleClickClose$2(uid, event);
-      break;
-    case 'Previous Match':
-      handleClickPreviousMatch(uid, event);
-      break;
-    case 'Next Match':
-      handleClickNextMatch(uid, event);
-      break;
-    case 'Toggle Replace':
-      handleClickToggleReplace(uid, event);
-      break;
-  }
-};
-const handleInputBlur = event => {
-  const uid = fromEvent(event);
-  handleBlur$a(uid);
-};
-const handleFocus$5 = event => {
-  const uid = fromEvent(event);
-  handleFocus$c(uid);
-};
-
-const ViewletFindWidgetEvents = {
-  __proto__: null,
-  handleClick: handleClick$5,
-  handleFocus: handleFocus$5,
-  handleInput: handleInput$5,
-  handleInputBlur
-};
-
-const create$g = () => {
-  const $Viewlet = document.createElement('div');
-  $Viewlet.className = 'Viewlet FindWidget';
-  $Viewlet.role = Group;
-  return {
-    $Viewlet
-  };
-};
-const focus$c = state => {
-  const {
-    $Viewlet
-  } = state;
-  const $InputBox = $Viewlet.querySelector('.MultilineInputBox');
-  if (!$InputBox) {
-    return;
-  }
-  $InputBox.focus();
-};
-const setValue$3 = (state, value) => {
-  const {
-    $Viewlet
-  } = state;
-  const $InputBox = $Viewlet.querySelector('.MultilineInputBox');
-  if (!$InputBox) {
-    return;
-  }
-  $InputBox.value = value;
-};
-const setDom$3 = (state, dom) => {
-  const {
-    $Viewlet
-  } = state;
-  rememberFocus($Viewlet, dom, ViewletFindWidgetEvents, 0);
-};
-
-const ViewletFindWidget = {
-  __proto__: null,
-  create: create$g,
-  focus: focus$c,
-  setDom: setDom$3,
-  setValue: setValue$3
-};
-
 const handleLocationsMouseDown = event => {
   if (event.button !== LeftClick) {
     return;
@@ -8296,7 +8304,7 @@ const ViewletLocationsEvents = {
   handleLocationsMouseDown
 };
 
-const Events$6 = ViewletLocationsEvents;
+const Events$7 = ViewletLocationsEvents;
 const setFocusedIndex$3 = (state, oldFocusedIndex, newFocusedIndex) => {
   const {
     $Viewlet
@@ -8331,7 +8339,7 @@ const focus$b = state => {
 
 const ViewletImplementations = {
   __proto__: null,
-  Events: Events$6,
+  Events: Events$7,
   focus: focus$b,
   handleError: handleError$1,
   setFocusedIndex: setFocusedIndex$3
@@ -8442,11 +8450,11 @@ const setColumnWidths = (state, columnWidth1, columnWidth2, columnWidth3) => {
   $Resizer1.style.left = `${paddingLeft + columnWidth1}px`;
   $Resizer2.style.left = `${paddingLeft + columnWidth1 + columnWidth2}px`;
 };
-const Events$5 = ViewletkeyBindingsEvents;
+const Events$6 = ViewletkeyBindingsEvents;
 
 const ViewletKeyBindings = {
   __proto__: null,
-  Events: Events$5,
+  Events: Events$6,
   setColumnWidths,
   setScrollBar: setScrollBar$2,
   setSize,
@@ -8943,7 +8951,7 @@ const handleBlur$3 = () => {
 const handleKeyDown$1 = handleKeyDown$2;
 const handleKeyUp = handleKeyUp$1;
 
-const create$f = () => {
+const create$e = () => {
   // TODO use aria role splitter once supported https://github.com/w3c/aria/issues/1348
   const $SashSideBar = document.createElement('div');
   $SashSideBar.className = 'Viewlet Sash SashVertical';
@@ -8964,20 +8972,20 @@ const create$f = () => {
     $SashPanel
   };
 };
-const attachEvents$7 = state => {
+const attachEvents$6 = state => {
   const {
     $SashSideBar,
     $SashPanel
   } = state;
-  attachEvents$d($SashSideBar, {
+  attachEvents$c($SashSideBar, {
     [PointerDown]: handleSashPointerDown,
     [DoubleClick]: handleSashDoubleClick
   });
-  attachEvents$d($SashPanel, {
+  attachEvents$c($SashPanel, {
     [PointerDown]: handleSashPointerDown,
     [DoubleClick]: handleSashDoubleClick
   });
-  attachEvents$d(window, {
+  attachEvents$c(window, {
     [Resize]: handleResize,
     [Focus]: handleFocus$3,
     [Blur]: handleBlur$3,
@@ -8998,8 +9006,8 @@ const setSashes = (state, sashSideBar, sashPanel) => {
 
 const ViewletLayout = {
   __proto__: null,
-  attachEvents: attachEvents$7,
-  create: create$f,
+  attachEvents: attachEvents$6,
+  create: create$e,
   setSashes
 };
 
@@ -9017,7 +9025,7 @@ const handleContextMenu$7 = event => {
 };
 
 // TODO Main should not be bound to Editor -> Lazy load Editor
-const create$e = () => {
+const create$d = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.id = 'Main';
   $Viewlet.className = 'Viewlet Main';
@@ -9038,11 +9046,11 @@ const create$e = () => {
     $DragOverlay: undefined
   };
 };
-const attachEvents$6 = state => {
+const attachEvents$5 = state => {
   const {
     $Viewlet
   } = state;
-  attachEvents$d($Viewlet, {
+  attachEvents$c($Viewlet, {
     [Drop]: handleDrop,
     [DragOver]: handleDragOver,
     [DragEnd]: handleDragEnd,
@@ -9114,10 +9122,10 @@ const setDragOverlay = (state, visible, x, y, width, height) => {
 const ViewletMain = {
   __proto__: null,
   addEditor,
-  attachEvents: attachEvents$6,
+  attachEvents: attachEvents$5,
   closeAllViewlets,
   closeViewletAndTab,
-  create: create$e,
+  create: create$d,
   dispose: dispose$7,
   focus: focus$a,
   highlightDragOver,
@@ -9166,7 +9174,7 @@ const handleTabsContextMenu = event => {
   handleTabContextMenu(uid, clientX, clientY);
 };
 
-const create$d = () => {
+const create$c = () => {
   const $MainTabs = document.createElement('div');
   $MainTabs.className = 'Viewlet MainTabs';
   $MainTabs.role = TabList;
@@ -9176,11 +9184,11 @@ const create$d = () => {
     $MainTabs
   };
 };
-const attachEvents$5 = state => {
+const attachEvents$4 = state => {
   const {
     $MainTabs
   } = state;
-  attachEvents$d($MainTabs, {
+  attachEvents$c($MainTabs, {
     [MouseDown]: handleTabsMouseDown,
     [ContextMenu]: handleTabsContextMenu,
     [DragStart]: handleDragStart
@@ -9202,13 +9210,13 @@ const setScrollLeft = (state, scrollLeft) => {
 
 const ViewletMainTabs = {
   __proto__: null,
-  attachEvents: attachEvents$5,
-  create: create$d,
+  attachEvents: attachEvents$4,
+  create: create$c,
   setScrollLeft,
   setTabsDom: setTabsDom$2
 };
 
-const create$c = () => {
+const create$b = () => {
   const $ViewletOutputContent = document.createElement('div');
   $ViewletOutputContent.className = 'OutputContent';
   $ViewletOutputContent.role = Log;
@@ -9242,7 +9250,7 @@ const handleError = (state, error) => {
 };
 const focus$9 = state => {
   object(state);
-  focus$i(state.$ViewletOutputContent);
+  focus$h(state.$ViewletOutputContent);
   send('Focus.setFocus', FocusOutput);
 };
 
@@ -9260,7 +9268,7 @@ const dispose$6 = state => {};
 const ViewletOutput = {
   __proto__: null,
   clear,
-  create: create$c,
+  create: create$b,
   dispose: dispose$6,
   disposeFindWidget,
   focus: focus$9,
@@ -9313,7 +9321,7 @@ const UiStrings = {
   Close: 'Close',
   Maximize: 'Maximize'
 };
-const create$b = () => {
+const create$a = () => {
   const $PanelTabs = document.createElement('div');
   $PanelTabs.className = 'PanelTabs';
   $PanelTabs.role = TabList;
@@ -9351,19 +9359,19 @@ const create$b = () => {
   };
   // await openViewlet('Terminal')
 };
-const attachEvents$4 = state => {
+const attachEvents$3 = state => {
   const {
     $ButtonMaximize,
     $ButtonClose,
     $PanelHeader
   } = state;
-  attachEvents$d($PanelHeader, {
+  attachEvents$c($PanelHeader, {
     [Click]: handleHeaderClick$2
   });
-  attachEvents$d($ButtonMaximize, {
+  attachEvents$c($ButtonMaximize, {
     [Click]: handleClickMaximize
   });
-  attachEvents$d($ButtonClose, {
+  attachEvents$c($ButtonClose, {
     [Click]: handleClickClose$1
   });
 };
@@ -9425,8 +9433,8 @@ const setActionsDom$1 = (state, actions, childUid) => {
 
 const ViewletPanel = {
   __proto__: null,
-  attachEvents: attachEvents$4,
-  create: create$b,
+  attachEvents: attachEvents$3,
+  create: create$a,
   dispose: dispose$5,
   focus: focus$8,
   setActionsDom: setActionsDom$1,
@@ -9641,8 +9649,8 @@ const focus$6 = state => {
 // - for windows narrator, ariaLabel works well
 // - for nvda ariaRoleDescription works better
 
-const create$a = () => {
-  const $QuickPickInput = create$C();
+const create$9 = () => {
+  const $QuickPickInput = create$A();
   $QuickPickInput.setAttribute(AriaControls, Ids.QuickPickItems); // TODO use idl once supported
   $QuickPickInput.role = ComboBox;
   $QuickPickInput.ariaLabel = 'Type the name of a command to run.';
@@ -9674,16 +9682,16 @@ const create$a = () => {
     $QuickPickStatus: undefined
   };
 };
-const attachEvents$3 = state => {
+const attachEvents$2 = state => {
   const {
     $QuickPickItems,
     $QuickPickInput
   } = state;
-  attachEvents$d($QuickPickItems, {
+  attachEvents$c($QuickPickItems, {
     [PointerDown]: handlePointerDown
   });
   $QuickPickItems.addEventListener(Wheel, handleWheel$3, Passive);
-  attachEvents$d($QuickPickInput, {
+  attachEvents$c($QuickPickInput, {
     [Blur]: handleBlur$2,
     [BeforeInput]: handleBeforeInput
   });
@@ -9751,8 +9759,8 @@ const noop = state => {};
 
 const ViewletQuickPick = {
   __proto__: null,
-  attachEvents: attachEvents$3,
-  create: create$a,
+  attachEvents: attachEvents$2,
+  create: create$9,
   dispose: dispose$4,
   focus: focus$6,
   hideStatus,
@@ -9767,7 +9775,7 @@ const ViewletQuickPick = {
 
 const ViewletReferences = {
   __proto__: null,
-  Events: Events$6,
+  Events: Events$7,
   focus: focus$b,
   handleError: handleError$1,
   setFocusedIndex: setFocusedIndex$3
@@ -9923,7 +9931,7 @@ const handleLoadedMetaData = event => {
   target.play();
 };
 
-const create$9 = () => {
+const create$8 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.className = 'Viewlet ScreenCapture';
   return {
@@ -9943,7 +9951,7 @@ const setScreenCapture = (state, id) => {
 
 const ViewletScreenCapture = {
   __proto__: null,
-  create: create$9,
+  create: create$8,
   setScreenCapture
 };
 
@@ -10107,11 +10115,11 @@ const setFocus = (state, selector) => {
   }
 };
 const dispose$3 = () => {};
-const Events$4 = ViewletSearchEvents;
+const Events$5 = ViewletSearchEvents;
 
 const ViewletSearch = {
   __proto__: null,
-  Events: Events$4,
+  Events: Events$5,
   dispose: dispose$3,
   focus: focus$5,
   setFocus,
@@ -10133,7 +10141,7 @@ const handleHeaderClick = event => {
   }
 };
 
-const create$8 = () => {
+const create$7 = () => {
   const $SideBarTitleAreaTitle = document.createElement('h2');
   $SideBarTitleAreaTitle.className = 'SideBarTitleAreaTitle';
   const $SideBarTitleArea = document.createElement('div');
@@ -10154,11 +10162,11 @@ const create$8 = () => {
     $Actions: undefined
   };
 };
-const attachEvents$2 = state => {
+const attachEvents$1 = state => {
   const {
     $SideBarTitleArea
   } = state;
-  attachEvents$d($SideBarTitleArea, {
+  attachEvents$c($SideBarTitleArea, {
     [Click]: handleHeaderClick
   });
 };
@@ -10196,8 +10204,8 @@ const focus$4 = async () => {
 
 const ViewletSideBar = {
   __proto__: null,
-  attachEvents: attachEvents$2,
-  create: create$8,
+  attachEvents: attachEvents$1,
+  create: create$7,
   dispose: dispose$2,
   focus: focus$4,
   setActionsDom,
@@ -10398,7 +10406,7 @@ const ViewletStatusBarEvents = {
   handleClick: handleClick$2
 };
 
-const create$7 = () => {
+const create$6 = () => {
   const $Viewlet = document.createElement('div');
   $Viewlet.id = 'StatusBar';
   $Viewlet.className = 'Viewlet StatusBar';
@@ -10411,7 +10419,7 @@ const create$7 = () => {
     $Viewlet
   };
 };
-const setDom$2 = (state, dom) => {
+const setDom$1 = (state, dom) => {
   const {
     $Viewlet
   } = state;
@@ -10427,9 +10435,9 @@ const focus$2 = state => {
 
 const ViewletStatusBar = {
   __proto__: null,
-  create: create$7,
+  create: create$6,
   focus: focus$2,
-  setDom: setDom$2
+  setDom: setDom$1
 };
 
 const handleClick$1 = event => {
@@ -10437,31 +10445,16 @@ const handleClick$1 = event => {
   handleClick$9(uid);
 };
 
-const create$6 = () => {
-  const $Viewlet = document.createElement('div');
-  $Viewlet.className = 'Viewlet Storage';
-  return {
-    $Viewlet
-  };
-};
-const attachEvents$1 = state => {
-  const {
-    $Viewlet
-  } = state;
-  $Viewlet.onclick = handleClick$1;
-};
-const setDom$1 = (state, dom) => {
-  const {
-    $Viewlet
-  } = state;
-  renderInto($Viewlet, dom);
+const ViewletStorageEvents = {
+  __proto__: null,
+  handleClick: handleClick$1
 };
 
+const Events$4 = ViewletStorageEvents;
+
 const ViewletStorage = {
   __proto__: null,
-  attachEvents: attachEvents$1,
-  create: create$6,
-  setDom: setDom$1
+  Events: Events$4
 };
 
 const isUint8Array = value => {
@@ -10731,7 +10724,7 @@ const attachEvents = state => {
   const {
     $Viewlet
   } = state;
-  attachEvents$d($Viewlet, {
+  attachEvents$c($Viewlet, {
     [ContextMenu]: handleContextMenu$4
   });
 };
@@ -11385,7 +11378,7 @@ const handleContextMenu$1 = event => {
   } = event;
   return ['handleContextMenu', button, clientX, clientY];
 };
-const handleSashCornerPointerDown = create$L(event => {
+const handleSashCornerPointerDown = create$K(event => {
   const {
     clientX,
     clientY