@lvce-editor/renderer-process 28.0.0 → 29.0.0

package/dist/rendererProcessMain.js

@@ -76,10 +76,8 @@ const readText = async () => {
 const normalizeItems = async items => {
   const normalized = [];
   for (const clipboardItem of items) {
-    for (const type of clipboardItem.types) {
-      if (!type.startsWith('web ')) {
-        continue;
-      }
+    const webTypes = clipboardItem.types.filter(type => type.startsWith('web '));
+    for (const type of webTypes) {
       const blob = await clipboardItem.getType(type);
       normalized.push({
         blob,
@@ -98,11 +96,11 @@ const writeText = async text => {
   string(text);
   await navigator.clipboard.writeText(text);
 };
-const toClipBoardItem = options => {
+const toClipboardItem = options => {
   return new ClipboardItem(options);
 };
 const write$1 = async itemOptions => {
-  const items = itemOptions.map(toClipBoardItem);
+  const items = itemOptions.map(toClipboardItem);
   await navigator.clipboard.write(items);
 };
 const writeImage = async blob => {
@@ -184,7 +182,7 @@ const uidSymbol = Symbol('uid');
 
 const getUidTarget = $Element => {
   while ($Element) {
-    if ($Element[uidSymbol]) {
+    if (Object.getOwnPropertyDescriptor($Element, uidSymbol)?.value) {
       return $Element;
     }
     $Element = $Element.parentNode;
@@ -193,14 +191,18 @@ const getUidTarget = $Element => {
 };
 
 const setComponentUid = ($Element, uid) => {
-  $Element[uidSymbol] = uid;
+  Object.defineProperty($Element, uidSymbol, {
+    configurable: true,
+    value: uid,
+    writable: true
+  });
 };
 const getComponentUid = $Element => {
   const $Target = getUidTarget($Element);
   if (!$Target) {
     return 0;
   }
-  return $Target[uidSymbol];
+  return Object.getOwnPropertyDescriptor($Target, uidSymbol)?.value;
 };
 const getComponentUidFromEvent = event => {
   const {
@@ -227,10 +229,10 @@ const setDragImage = (dataTransfer, label) => {
   dragImage.textContent = label;
   document.body.append(dragImage);
   dataTransfer.setDragImage(dragImage, -10, -10);
-  const handleTimeOut = () => {
+  const handleTimeout = () => {
     dragImage.remove();
   };
-  setTimeout(handleTimeOut, 0);
+  setTimeout(handleTimeout, 0);
 };
 
 const applyDragInfoMaybe = event => {
@@ -451,10 +453,7 @@ const getEventListenerArg = (param, event) => {
 };
 
 const getEventListenerArgs = (params, event) => {
-  const serialized = [];
-  for (const param of params) {
-    serialized.push(getEventListenerArg(param, event));
-  }
+  const serialized = Array.from(params, param => getEventListenerArg(param, event));
   return serialized;
 };
 
@@ -1257,13 +1256,13 @@ const attachEvent = ($Node, eventMap, key, value, newEventMap) => {
   if (previous) {
     $Node.removeEventListener(keyLower, previous.listener, previous.options);
   }
-  if (newEventMap && newEventMap[value]) {
-    const fn = newEventMap[value];
+  const fn = newEventMap?.[value];
+  if (fn) {
     const options = getOptions(fn);
     // TODO support event listener options
-    $Node.addEventListener(keyLower, newEventMap[value], options);
+    $Node.addEventListener(keyLower, fn, options);
     listenersByEvent.set(keyLower, {
-      listener: newEventMap[value],
+      listener: fn,
       options
     });
     attachedListeners.set($Node, listenersByEvent);
@@ -1681,7 +1680,7 @@ const getActiveElementInside = $Viewlet => {
 };
 
 const queryInputs = $Viewlet => {
-  return [...$Viewlet.querySelectorAll('input, textarea, select')];
+  return [...$Viewlet.querySelectorAll(':scope input, :scope textarea, :scope select')];
 };
 
 const focusElement = $Element => {
@@ -1707,7 +1706,7 @@ const createHiddenContainer = (activeElement, focused) => {
   return $Hidden;
 };
 const restoreFocusedElement = ($Hidden, $New, focused) => {
-  const $NewFocused = $New.querySelector(`[name="${focused}"]`);
+  const $NewFocused = $New.querySelector(`[name="${CSS.escape(focused)}"]`);
   if (!$NewFocused) {
     return;
   }
@@ -1742,7 +1741,7 @@ const restoreFocus = ($Viewlet, isRootTree, isTreeFocused, focused) => {
     return;
   }
   if (isTreeFocused) {
-    const $Tree = $Viewlet.querySelector('[role="tree"]');
+    const $Tree = $Viewlet.querySelector(':scope [role="tree"]');
     if ($Tree) {
       // @ts-ignore
       focusElement($Tree);
@@ -1752,7 +1751,7 @@ const restoreFocus = ($Viewlet, isRootTree, isTreeFocused, focused) => {
   if (!focused) {
     return;
   }
-  const $Focused = $Viewlet.querySelector(`[name="${focused}"]`);
+  const $Focused = $Viewlet.querySelector(`[name="${CSS.escape(focused)}"]`);
   if ($Focused) {
     // @ts-ignore
     focusElement($Focused);
@@ -1817,9 +1816,9 @@ const addFileHandle = fileHandle => {
 const getTitleBarHeight = () => {
   if (
   // @ts-expect-error
-  navigator.windowControlsOverlay?.getTitlebarAreaRect) {
+  globalThis.navigator.windowControlsOverlay?.getTitlebarAreaRect) {
     // @ts-expect-error
-    const titleBarRect = navigator.windowControlsOverlay.getTitlebarAreaRect();
+    const titleBarRect = globalThis.navigator.windowControlsOverlay.getTitlebarAreaRect();
     return titleBarRect.height;
   }
   return 0;
@@ -2077,7 +2076,7 @@ const getData$1 = event => {
 };
 const wrap = worker => {
   let handleMessage;
-  return {
+  const wrapped = {
     get onmessage() {
       return handleMessage;
     },
@@ -2087,7 +2086,7 @@ const wrap = worker => {
           const data = getData$1(event);
           listener({
             data,
-            target: this
+            target: wrapped
           });
         };
       } else {
@@ -2103,6 +2102,7 @@ const wrap = worker => {
       worker.postMessage(message, transfer);
     }
   };
+  return wrapped;
 };
 
 const IpcParentWithModuleWorker$2 = {
@@ -2120,7 +2120,10 @@ const create$J = async ({
 }) => {
   string(url);
   const portPromise = await new Promise(resolve => {
-    globalThis.acceptPort = resolve;
+    Object.defineProperty(globalThis, 'acceptPort', {
+      configurable: true,
+      value: resolve
+    });
   });
   await import(url);
   const port = await portPromise;
@@ -2141,7 +2144,10 @@ const IpcParentWithMessagePort$2 = {
 
 const create$I = async url => {
   const referencePort = await new Promise(resolve => {
-    globalThis.acceptReferencePort = resolve;
+    Object.defineProperty(globalThis, 'acceptReferencePort', {
+      configurable: true,
+      value: resolve
+    });
     import(url);
   });
   delete globalThis.acceptReferencePort;
@@ -3542,7 +3548,7 @@ const create$Widgets = () => {
   return $Widgets;
 };
 const append$1 = $Element => {
-  // TODO should not call append in the first place if it is already in dom
+  // TODO should not call append in the first place if it is already in DOM
   if (state$6.widgetSet.has($Element)) {
     return;
   }
@@ -3680,7 +3686,7 @@ const Menu = 'menu';
 const None$1 = 'none';
 const Status = 'status';
 const TabList = 'tablist';
-const ToolBar = 'toolbar';
+const Toolbar = 'toolbar';
 
 const create$BackDrop = () => {
   const $BackDrop = document.createElement('div');
@@ -3730,7 +3736,7 @@ const stopPropagation = event => {
   event.stopPropagation();
 };
 
-// TODO this module should be called dom or dom utils
+// TODO this module should be called DOM or DOM utils
 
 // TODO this module makes for weird code splitting chunks,
 // maybe duplicate the code per file for better chunks
@@ -3832,8 +3838,8 @@ const FocusOutput = 28;
 // TODO using .style.top, .style.left causes chrome devtools to show many layout shift -> maybe use transform instead
 
 // TODO when cycling through items, recalculate style is much slower
-// than in vscode (1.49ms vs 0.33ms)
-// paint is also faster in vscode (0.32ms vs 0.14ms)
+// than in VS Code (1.49ms vs 0.33ms)
+// paint is also faster in VS Code (0.32ms vs 0.14ms)
 
 // TODO focus on menu is not announced to screenreader
 
@@ -3972,7 +3978,7 @@ const focusIndex = (level, oldFocusedIndex, newFocusedIndex) => {
   }
 };
 
-// TODO replace function that recycles menu dom nodes
+// TODO replace function that recycles menu DOM nodes
 
 const handleBackDropMouseDown = event => {
   preventDefault(event);
@@ -3986,7 +3992,7 @@ const handleBackDropMouseDown = event => {
 const handleContextMenu$7 = event => {
   preventDefault(event);
 };
-const showMenu = (x, y, width, height, items, level, parentIndex = -1, dom, mouseBlocking = false) => {
+const showMenu = (x, y, width, height, items, level, parentIndex = -1, dom = [], mouseBlocking = false) => {
   if (mouseBlocking) {
     const $BackDrop = create$BackDrop();
     $BackDrop.onmousedown = handleBackDropMouseDown;
@@ -4015,7 +4021,7 @@ const showMenu = (x, y, width, height, items, level, parentIndex = -1, dom, mous
     send('Focus.setFocus', FocusMenu);
   }
 };
-const hideSubMenu = level => {
+const hideSubmenu = level => {
   const $$ChildMenus = state$3.$$Menus.slice(level);
   for (const $ChildMenu of $$ChildMenus) {
     remove$1($ChildMenu);
@@ -4061,7 +4067,6 @@ const showControlled = ({
   x,
   y
 }) => {
-  // @ts-expect-error
   showMenu(x, y, width, height, items, level);
   // TODO menu should not necessarily know about parent (titleBarMenuBar)
   // it should be the other way around
@@ -4098,7 +4103,7 @@ const openUrl = url => {
   window.open(url);
 };
 const redirectToUrl = url => {
-  window.location.href = url;
+  window.location.assign(url);
 };
 
 const isElectronUserAgentSpecificMemoryError = error => {
@@ -4111,9 +4116,9 @@ const isElectronUserAgentSpecificMemoryError = error => {
 const measureUserAgentSpecificMemory = async () => {
   try {
     // @ts-expect-error
-    if (performance?.measureUserAgentSpecificMemory) {
+    if (globalThis.performance?.measureUserAgentSpecificMemory) {
       // @ts-expect-error
-      const memory = await performance.measureUserAgentSpecificMemory();
+      const memory = await globalThis.performance.measureUserAgentSpecificMemory();
       return memory;
     }
   } catch (error) {
@@ -4158,7 +4163,7 @@ const getCombinedErrorMessage = (error, message) => {
   if (message) {
     return `${message}: ${error}`;
   }
-  return `${error}`;
+  return String(error);
 };
 
 const mergeStacks = (parent, child) => {
@@ -4180,7 +4185,8 @@ const getErrorStack = error => {
     return error.stack;
   }
   if (error && error.lineNumber && error.columnNumber && error.fileName) {
-    const normalStackLooksLike = new Error().stack;
+    const testError = new Error();
+    const normalStackLooksLike = testError.stack;
     // @ts-ignore
     if (/^[$\w]+@.*/.test(normalStackLooksLike)) {
       // firefox stack trace
@@ -4546,7 +4552,7 @@ const press = options => {
   keyUp(element, options);
 };
 
-const KeyBoardActions = {
+const KeyboardActions = {
   __proto__: null,
   press
 };
@@ -4694,8 +4700,8 @@ const performAction = async (locator, fnName, options) => {
   }
   fn(element, options);
 };
-const performKeyBoardAction = (fnName, options) => {
-  const fn = KeyBoardActions[fnName];
+const performKeyboardAction = (fnName, options) => {
+  const fn = KeyboardActions[fnName];
   fn(options);
 };
 const checkSingleElementCondition = async (locator, fnName, options) => {
@@ -4769,7 +4775,8 @@ const transferToWebView = objectId => {
   // TODO allow specifying transfer origin from renderer worker
   // TODO allow specifing method from renderer worker
   const port = acquire(objectId);
-  const targetOrigin = new URL($Iframe.src || location.href, location.href).origin;
+  const targetUrl = new URL($Iframe.src || location.href, location.href);
+  const targetOrigin = targetUrl.origin;
   contentWindow.postMessage({
     jsonrpc: '2.0',
     method: 'handlePort',
@@ -4801,7 +4808,7 @@ const getIdentifiers = () => {
   return state$2.identifiers;
 };
 
-// TODO store keybindings as json somewhere
+// TODO store keybindings as JSON somewhere
 
 // TODO sort keybindings by `when` priority -> focus.editorCompletions: 10, focus.editor:9 etc.
 
@@ -4809,7 +4816,7 @@ const getIdentifiers = () => {
 // could remove some context logic and have less user configuration when these are default
 // e.g. arrow down focuses next, arrow up always focuses previous item (like in aria spec)
 
-// TODO ui should only have keys -> commands get resolved inside renderer worker
+// TODO UI should only have keys -> commands get resolved inside renderer worker
 // TODO should toggle terminal, not only open
 
 const setIdentifiers = identifiers => {
@@ -5229,7 +5236,7 @@ const setOffsetX = (state, offsetX) => {
   const {
     $Viewlet
   } = state;
-  const $ColorPickerSliderThumb = $Viewlet.querySelector('.ColorPickerSliderThumb');
+  const $ColorPickerSliderThumb = $Viewlet.querySelector(':scope .ColorPickerSliderThumb');
   setXAndYTransform($ColorPickerSliderThumb, offsetX, 0);
   applyUidWorkaround($Viewlet);
 };
@@ -5319,14 +5326,14 @@ const setValue$2 = (state, value) => {
   const {
     $Viewlet
   } = state;
-  const $Input = $Viewlet.querySelector('input');
+  const $Input = $Viewlet.querySelector(':scope input');
   $Input.value = value;
 };
 const focus$c = state => {
   const {
     $Viewlet
   } = state;
-  const $Input = $Viewlet.querySelector('input');
+  const $Input = $Viewlet.querySelector(':scope input');
   $Input.focus();
 };
 
@@ -5355,7 +5362,7 @@ const create$p = icon => {
 };
 
 const create$Button = (label, icon) => {
-  // TODO icon div might not be needed (unnecessary html element)
+  // TODO icon div might not be needed (unnecessary HTML element)
   const $Icon = create$p(icon);
   const $Button = document.createElement('button');
   $Button.className = 'IconButton';
@@ -5559,7 +5566,7 @@ const setIframe$3 = (state, src, sandbox = []) => {
   const {
     $Viewlet
   } = state;
-  const $Parent = $Viewlet.querySelector('.E2eTestIframeWrapper');
+  const $Parent = $Viewlet.querySelector(':scope .E2eTestIframeWrapper');
   const $Iframe = document.createElement('iframe');
   for (const element of sandbox) {
     $Iframe.sandbox.add(element);
@@ -5572,7 +5579,7 @@ const setPreviewTransform = (state, transform) => {
   const {
     $Viewlet
   } = state;
-  const $Parent = $Viewlet.querySelector('.E2eTestIframeWrapper');
+  const $Parent = $Viewlet.querySelector(':scope .E2eTestIframeWrapper');
   $Parent.style.transform = transform;
 };
 // export const setPort = (state, portId, origin) => {
@@ -5935,7 +5942,7 @@ const handleError$5 = (state, error) => {
   const {
     $Viewlet
   } = state;
-  $Viewlet.textContent = `${error}`;
+  $Viewlet.textContent = String(error);
 };
 const setBounds$8 = (state, x, y, width, height) => {
   const {
@@ -6018,7 +6025,7 @@ const ViewletEditorCompletionDetails = {
   setDom: setDom$7
 };
 
-// TODO not sure whether created dom node
+// TODO not sure whether created DOM node
 // should stay in state or be removed
 // one option would result in less memory usage
 // the other option would result in less garbage collection
@@ -6235,7 +6242,7 @@ const setTransform = (state, transform) => {
   const {
     $Viewlet
   } = state;
-  const $ImageWrapper = $Viewlet.querySelector('.ImageContent');
+  const $ImageWrapper = $Viewlet.querySelector(':scope .ImageContent');
   $ImageWrapper.style.transform = transform;
 };
 const setDragging = (state, isDragging) => {
@@ -6598,7 +6605,7 @@ const setValue$1 = (state, value) => {
   const {
     $Viewlet
   } = state;
-  const $InputBox = $Viewlet.querySelector('.MultilineInputBox');
+  const $InputBox = $Viewlet.querySelector(':scope .MultilineInputBox');
   if (!$InputBox) {
     return;
   }
@@ -6661,7 +6668,7 @@ const setFocusedIndex$1 = (state, oldFocusedIndex, newFocusedIndex) => {
   const {
     $Viewlet
   } = state;
-  const $Locations = $Viewlet.children[1];
+  const $Locations = $Viewlet.querySelector(':scope .LocationList');
   if (oldFocusedIndex === -1) {
     $Locations.classList.remove('FocusOutline');
   } else {
@@ -6771,7 +6778,7 @@ const setValue = (state, value) => {
   const {
     $Viewlet
   } = state;
-  const $InputBox = $Viewlet.querySelector('input');
+  const $InputBox = $Viewlet.querySelector(':scope input');
   $InputBox.value = value;
 };
 const setColumnWidths = (state, columnWidth1, columnWidth2, columnWidth3) => {
@@ -6779,7 +6786,7 @@ const setColumnWidths = (state, columnWidth1, columnWidth2, columnWidth3) => {
   const {
     $Viewlet
   } = state;
-  const $$Resizers = $Viewlet.querySelectorAll('.Resizer');
+  const $$Resizers = $Viewlet.querySelectorAll(':scope .Resizer');
   const $Resizer1 = $$Resizers[0];
   const $Resizer2 = $$Resizers[1];
   $Resizer1.style.left = `${paddingLeft + columnWidth1}px`;
@@ -6926,9 +6933,9 @@ const handleKeyUp = handleKeyUp$1;
 
 const create$c = () => {
   // TODO use aria role splitter once supported https://github.com/w3c/aria/issues/1348
-  const $SashSideBar = document.createElement('div');
-  $SashSideBar.className = 'Viewlet Sash SashVertical';
-  $SashSideBar.id = 'SashSideBar';
+  const $SashSidebar = document.createElement('div');
+  $SashSidebar.className = 'Viewlet Sash SashVertical';
+  $SashSidebar.id = 'SashSideBar';
 
   // TODO use aria role splitter once supported https://github.com/w3c/aria/issues/1348
   const $SashPanel = document.createElement('div');
@@ -6938,19 +6945,19 @@ const create$c = () => {
   $Viewlet.id = 'Workbench';
   $Viewlet.className = 'Viewlet Layout Workbench';
   $Viewlet.role = Application;
-  $Viewlet.append($SashSideBar, $SashPanel);
+  $Viewlet.append($SashSidebar, $SashPanel);
   return {
     $SashPanel,
-    $SashSideBar,
+    $SashSidebar,
     $Viewlet
   };
 };
 const attachEvents$2 = state => {
   const {
     $SashPanel,
-    $SashSideBar
+    $SashSidebar
   } = state;
-  attachEvents$6($SashSideBar, {
+  attachEvents$6($SashSidebar, {
     [DoubleClick]: handleSashDoubleClick,
     [PointerDown]: handleSashPointerDown
   });
@@ -6966,13 +6973,13 @@ const attachEvents$2 = state => {
     [Resize]: handleResize
   });
 };
-const setSashes = (state, sashSideBar, sashPanel) => {
+const setSashes = (state, sashSidebar, sashPanel) => {
   const {
     $SashPanel,
-    $SashSideBar
+    $SashSidebar
   } = state;
-  setBounds$a($SashSideBar, sashSideBar.x, sashSideBar.y, sashSideBar.width, sashSideBar.height);
-  $SashSideBar.classList.toggle('SashActive', sashSideBar.active);
+  setBounds$a($SashSidebar, sashSidebar.x, sashSidebar.y, sashSidebar.width, sashSidebar.height);
+  $SashSidebar.classList.toggle('SashActive', sashSidebar.active);
   setBounds$a($SashPanel, sashPanel.x, sashPanel.y, sashPanel.width, sashPanel.height);
   $SashPanel.classList.toggle('SashActive', sashPanel.active);
 };
@@ -7013,7 +7020,7 @@ const Panel = 'Panel';
 const References = 'References';
 const RunAndDebug = 'Run And Debug';
 const ScreenCapture = 'ScreenCapture';
-const SideBar$1 = 'SideBar';
+const Sidebar$1 = 'SideBar';
 const SimpleBrowser = 'SimpleBrowser';
 const SourceControl = 'Source Control';
 const StatusBar$1 = 'StatusBar';
@@ -7151,16 +7158,16 @@ const create$a = () => {
   const $ButtonMaximize = create$Button(UiStrings.Maximize, 'ChevronUp');
   // TODO use event delegation
 
-  const $PanelToolBar = document.createElement('div');
-  $PanelToolBar.className = 'PanelToolBar';
-  $PanelToolBar.role = ToolBar;
-  $PanelToolBar.append($ButtonMaximize, $ButtonClose);
+  const $PanelToolbar = document.createElement('div');
+  $PanelToolbar.className = 'PanelToolBar';
+  $PanelToolbar.role = Toolbar;
+  $PanelToolbar.append($ButtonMaximize, $ButtonClose);
   const $PanelActions = document.createElement('div');
   $PanelActions.className = 'Actions';
   $PanelActions.role = 'toolbar';
   const $PanelHeader = document.createElement('div');
   $PanelHeader.className = 'PanelHeader';
-  $PanelHeader.append($PanelTabs, $PanelActions, $PanelToolBar);
+  $PanelHeader.append($PanelTabs, $PanelActions, $PanelToolbar);
   // const $PanelContent = document.createElement('div')
   // $PanelContent.id = 'PanelContent'
   const $Viewlet = document.createElement('div');
@@ -7276,7 +7283,7 @@ const ViewletRunAndDebug = {
   __proto__: null
 };
 
-const handleLoadedMetaData = event => {
+const handleLoadedMetadata = event => {
   // TODO should send event to renderer worker, renderer worker should invoke play method
   const {
     target
@@ -7298,7 +7305,7 @@ const setScreenCapture = (state, id) => {
   const $Video = document.createElement('video');
   const screenCapture = get$2(id);
   $Video.srcObject = screenCapture;
-  $Video.onloadedmetadata = handleLoadedMetaData;
+  $Video.onloadedmetadata = handleLoadedMetadata;
   $Viewlet.append($Video);
 };
 
@@ -7308,7 +7315,7 @@ const ViewletScreenCapture = {
   setScreenCapture
 };
 
-const SideBar = 'Side Bar';
+const Sidebar = 'Side Bar';
 const StatusBar = 'Status Bar';
 
 const handleClickAction = (target, uid) => {
@@ -7328,44 +7335,44 @@ const handleHeaderClick = event => {
 };
 
 const create$8 = () => {
-  const $SideBarTitleAreaTitle = document.createElement('h2');
-  $SideBarTitleAreaTitle.className = 'SideBarTitleAreaTitle';
-  const $SideBarTitleArea = document.createElement('div');
-  $SideBarTitleArea.className = 'SideBarTitleArea';
-  $SideBarTitleArea.append($SideBarTitleAreaTitle);
+  const $SidebarTitleAreaTitle = document.createElement('h2');
+  $SidebarTitleAreaTitle.className = 'SideBarTitleAreaTitle';
+  const $SidebarTitleArea = document.createElement('div');
+  $SidebarTitleArea.className = 'SideBarTitleArea';
+  $SidebarTitleArea.append($SidebarTitleAreaTitle);
   const $Viewlet = document.createElement('div');
   $Viewlet.id = 'SideBar';
   $Viewlet.className = 'Viewlet SideBar';
   $Viewlet.role = Complementary;
-  $Viewlet.ariaRoleDescription = SideBar;
-  $Viewlet.append($SideBarTitleArea);
+  $Viewlet.ariaRoleDescription = Sidebar;
+  $Viewlet.append($SidebarTitleArea);
   return {
     $Actions: undefined,
-    $SideBar: $Viewlet,
-    $SideBarContent: undefined,
-    $SideBarTitleArea,
-    $SideBarTitleAreaTitle,
+    $Sidebar: $Viewlet,
+    $SidebarContent: undefined,
+    $SidebarTitleArea,
+    $SidebarTitleAreaTitle,
     $Viewlet
   };
 };
 const attachEvents = state => {
   const {
-    $SideBarTitleArea
+    $SidebarTitleArea
   } = state;
-  attachEvents$6($SideBarTitleArea, {
+  attachEvents$6($SidebarTitleArea, {
     [Click]: handleHeaderClick
   });
 };
 const dispose$5 = state => {
   object(state);
-  state.$SideBar.replaceChildren();
+  state.$Sidebar.replaceChildren();
 };
 const setTitle = (state, name) => {
   const {
-    $SideBarTitleAreaTitle
+    $SidebarTitleAreaTitle
   } = state;
-  $SideBarTitleAreaTitle.title = name;
-  $SideBarTitleAreaTitle.textContent = name;
+  $SidebarTitleAreaTitle.title = name;
+  $SidebarTitleAreaTitle.textContent = name;
 };
 const setActionsDom = (state, actions, parentId, eventMap = {}) => {
   if (actions.length === 0) {
@@ -7373,14 +7380,14 @@ const setActionsDom = (state, actions, parentId, eventMap = {}) => {
   }
   const {
     $Actions,
-    $SideBarTitleArea
+    $SidebarTitleArea
   } = state;
   const $Parent = document.createElement('div');
   const $NewViewlet = rememberFocus$1($Parent, actions, {}, parentId);
   if ($Actions) {
     $Actions.replaceWith($NewViewlet);
   } else {
-    $SideBarTitleArea.append($NewViewlet);
+    $SidebarTitleArea.append($NewViewlet);
   }
   state.$Actions = $NewViewlet;
 };
@@ -7388,7 +7395,7 @@ const focus$5 = async () => {
   // await
 };
 
-const ViewletSideBar = {
+const ViewletSidebar = {
   __proto__: null,
   attachEvents,
   create: create$8,
@@ -7580,7 +7587,7 @@ const focus$4 = state => {
   const {
     $Viewlet
   } = state;
-  $Viewlet.querySelector('input').focus();
+  $Viewlet.querySelector(':scope input').focus();
 };
 
 const ViewletSourceControl = {
@@ -8170,7 +8177,7 @@ const setIframe = (state, src, sandbox = [], srcDoc = '', csp = '', credentialle
   const {
     $Viewlet
   } = state;
-  const $Parent = $Viewlet.querySelector('.WebViewWrapper');
+  const $Parent = $Viewlet.querySelector(':scope .WebViewWrapper');
   if (!$Parent) {
     throw new Error('webview wrapper not found');
   }
@@ -8258,7 +8265,7 @@ const moduleLoaders = {
   [References]: () => ViewletReferences,
   [RunAndDebug]: () => ViewletRunAndDebug,
   [ScreenCapture]: () => ViewletScreenCapture,
-  [SideBar$1]: () => ViewletSideBar,
+  [Sidebar$1]: () => ViewletSidebar,
   [SimpleBrowser]: () => ViewletSimpleBrowser,
   [SourceControl]: () => ViewletSourceControl,
   [StatusBar$1]: () => ViewletStatusBar,
@@ -8284,7 +8291,7 @@ const load$1 = moduleId => {
 
 const state$1 = {
   currentPanelView: undefined,
-  currentSideBarView: undefined,
+  currentSidebarView: undefined,
   modules: Object.create(null)
 };
 
@@ -8418,7 +8425,7 @@ const setInputValues = (viewletId, items) => {
     setElementProperty(viewletId, name, 'value', value);
   }
 };
-const setCheckBoxValue = (viewletId, name, value) => {
+const setCheckboxValue = (viewletId, name, value) => {
   setElementProperty(viewletId, name, 'checked', value);
 };
 const setSelectionByName = (viewletId, name, start, end) => {
@@ -8493,18 +8500,18 @@ const isSpecial = id => {
   return specialIds.has(id);
 };
 const createPlaceholder = (viewletId, parentId, top, left, width, height) => {
-  const $PlaceHolder = document.createElement('div');
-  $PlaceHolder.className = `Viewlet ${viewletId}`;
-  setBounds$a($PlaceHolder, left, top, width, height);
+  const $Placeholder = document.createElement('div');
+  $Placeholder.className = `Viewlet ${viewletId}`;
+  setBounds$a($Placeholder, left, top, width, height);
   if (isSpecial(viewletId)) {
-    $PlaceHolder.id = viewletId;
+    $Placeholder.id = viewletId;
   }
   const parentInstance = get$a(parentId);
   const $Parent = parentInstance.state.$Viewlet;
-  $Parent.append($PlaceHolder);
+  $Parent.append($Placeholder);
   set$9(viewletId, {
     state: {
-      $Viewlet: $PlaceHolder
+      $Viewlet: $Placeholder
     }
   });
 };
@@ -8541,7 +8548,7 @@ const setDom2 = (viewletId, dom) => {
       uid = get($Viewlet);
     } catch {}
   }
-  // TODO optimize rendering with virtual dom diffing
+  // TODO optimize rendering with virtual DOM diffing
   const $NewViewlet = rememberFocus($Viewlet, dom, Events, viewletId);
   if (uid) {
     // @ts-ignore
@@ -8648,7 +8655,7 @@ const handleError$1 = (id, parentId, message) => {
     return;
   }
   if (instance?.state.$Viewlet) {
-    instance.state.$Viewlet.textContent = `${message}`;
+    instance.state.$Viewlet.textContent = String(message);
   }
   // TODO error should bubble up to until highest possible component
   const parentInstance = get$a(parentId);
@@ -8767,22 +8774,23 @@ const replaceChildren = (parentId, childIds) => {
   $Parent.replaceChildren($Fragment);
 };
 const applyLateFocusMaybe = () => {
-  if (focusCallback !== emptyFocusCallback) {
+  if (focusCallback === emptyFocusCallback) {
+    return;
+  }
+  const {
+    id,
+    selector
+  } = focusCallback;
+  focusCallback = emptyFocusCallback;
+  const instance = get$a(id);
+  if (instance) {
     const {
-      id,
-      selector
-    } = focusCallback;
-    focusCallback = emptyFocusCallback;
-    const instance = get$a(id);
-    if (instance) {
-      const {
-        $Viewlet
-      } = instance.state;
-      const $Element = $Viewlet.querySelector(selector);
-      if ($Element) {
-        $Element.focus();
-        focusCallback = emptyFocusCallback;
-      }
+      $Viewlet
+    } = instance.state;
+    const $Element = $Viewlet.querySelector(selector);
+    if ($Element) {
+      $Element.focus();
+      focusCallback = emptyFocusCallback;
     }
   }
 };
@@ -8853,7 +8861,7 @@ const commandHandlers = {
   'Viewlet.replaceChildren': replaceChildren,
   'Viewlet.send': invoke,
   'Viewlet.setBounds': setBounds$1,
-  'Viewlet.setCheckBoxValue': setCheckBoxValue,
+  'Viewlet.setCheckBoxValue': setCheckboxValue,
   'Viewlet.setCss': addCssStyleSheet,
   'Viewlet.setDom': setDom,
   'Viewlet.setDom2': setDom2,
@@ -8941,15 +8949,17 @@ const set$1 = title => {
 
 // workaround for not being setPointerCapture() not working on
 // synthetic events
+let originalSetPointerCapture;
+let originalReleasePointerCapture;
 const mock = () => {
-  globalThis._originalSetPointerCapture = Element.prototype.setPointerCapture;
-  globalThis._originalReleasePointerCapture = Element.prototype.releasePointerCapture;
+  originalSetPointerCapture = Element.prototype.setPointerCapture;
+  originalReleasePointerCapture = Element.prototype.releasePointerCapture;
   Element.prototype.setPointerCapture = () => {};
   Element.prototype.releasePointerCapture = () => {};
 };
 const unmock = () => {
-  Element.prototype.setPointerCapture = globalThis._originalSetPointerCapture;
-  Element.prototype.releasePointerCapture = globalThis._originalReleasePointerCapture;
+  Element.prototype.setPointerCapture = originalSetPointerCapture;
+  Element.prototype.releasePointerCapture = originalReleasePointerCapture;
 };
 
 const isFile = value => {
@@ -9086,7 +9096,7 @@ const commandMap = {
   'MeasureTextHeight.measureTextHeight': measureTextHeight,
   'Menu.focusIndex': focusIndex,
   'Menu.hide': hide,
-  'Menu.hideSubMenu': hideSubMenu,
+  'Menu.hideSubMenu': hideSubmenu,
   'Menu.showControlled': showControlled,
   'Menu.showMenu': showMenu,
   'Meta.setThemeColor': setThemeColor,
@@ -9108,7 +9118,7 @@ const commandMap = {
   'TestFrameWork.checkSingleElementCondition': checkSingleElementCondition,
   'TestFrameWork.performAction': performAction,
   'TestFrameWork.performAction2': performAction2,
-  'TestFrameWork.performKeyBoardAction': performKeyBoardAction,
+  'TestFrameWork.performKeyBoardAction': performKeyboardAction,
   'TestFrameWork.showOverlay': showOverlay,
   'TestFrameWork.transfer': transfer,
   'TestFrameWork.transferToWebView': transferToWebView,
@@ -9386,9 +9396,9 @@ const getIsFirefox = () => {
   }
   if (
   // @ts-expect-error
-  navigator.userAgentData?.brands) {
+  globalThis.navigator.userAgentData?.brands) {
     // @ts-expect-error
-    return navigator.userAgentData.brands.includes('Firefox');
+    return globalThis.navigator.userAgentData.brands.includes('Firefox');
   }
   return navigator.userAgent.toLowerCase().includes('firefox');
 };
@@ -9550,7 +9560,7 @@ const handleError = async (error, notify = true, prefix = '') => {
 };
 
 const isChromeExtensionError = error => {
-  return `${error}` === 'Script error.';
+  return String(error) === 'Script error.';
 };
 
 const handleUnhandledRejection = event => {
@@ -9832,7 +9842,7 @@ const create = () => {
   const $Viewlet = document.createElement('div');
   const term = new Dl();
   term.open($Viewlet);
-  term.write('Hello from \u001B[1;3;31mxterm.js\u001B[0m $ ');
+  term.write('Hello from \u{1B}[1;3;31mxterm.js\u{1B}[0m $ ');
   return {
     $Viewlet
   };

package/package.json

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