@lvce-editor/static-server 0.61.16 → 0.62.0

package/static/{7697c47 → 2a5a40f}/packages/title-bar-worker/dist/titleBarWorkerMain.js

@@ -61,7 +61,7 @@ class AssertionError extends Error {
   }
 }
 const Object$1 = 1;
-const Number = 2;
+const Number$1 = 2;
 const Array$1 = 3;
 const String = 4;
 const Boolean$1 = 5;
@@ -71,7 +71,7 @@ const Unknown$1 = 8;
 const getType = value => {
   switch (typeof value) {
     case 'number':
-      return Number;
+      return Number$1;
     case 'function':
       return Function;
     case 'string':
@@ -98,7 +98,7 @@ const object = value => {
 };
 const number = value => {
   const type = getType(value);
-  if (type !== Number) {
+  if (type !== Number$1) {
     throw new AssertionError('expected value to be of type number');
   }
 };
@@ -108,18 +108,6 @@ const array = value => {
     throw new AssertionError('expected value to be of type array');
   }
 };
-const string = value => {
-  const type = getType(value);
-  if (type !== String) {
-    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 isMessagePort = value => {
   return value && value instanceof MessagePort;
@@ -903,6 +891,109 @@ const WebWorkerRpcClient = {
   __proto__: null,
   create: create$3
 };
+const createMockRpc = ({
+  commandMap
+}) => {
+  const invocations = [];
+  const invoke = (method, ...params) => {
+    invocations.push([method, ...params]);
+    const command = commandMap[method];
+    if (!command) {
+      throw new Error(`command ${method} not found`);
+    }
+    return command(...params);
+  };
+  const mockRpc = {
+    invoke,
+    invokeAndTransfer: invoke,
+    invocations
+  };
+  return mockRpc;
+};
+
+const toCommandId = key => {
+  const dotIndex = key.indexOf('.');
+  return key.slice(dotIndex + 1);
+};
+const create$2 = () => {
+  const states = Object.create(null);
+  const commandMapRef = {};
+  return {
+    get(uid) {
+      return states[uid];
+    },
+    set(uid, oldState, newState) {
+      states[uid] = {
+        oldState,
+        newState
+      };
+    },
+    dispose(uid) {
+      delete states[uid];
+    },
+    getKeys() {
+      return Object.keys(states).map(key => {
+        return Number.parseInt(key);
+      });
+    },
+    clear() {
+      for (const key of Object.keys(states)) {
+        delete states[key];
+      }
+    },
+    wrapCommand(fn) {
+      const wrapped = async (uid, ...args) => {
+        const {
+          newState
+        } = states[uid];
+        const newerState = await fn(newState, ...args);
+        if (newState === newerState) {
+          return;
+        }
+        const latest = states[uid];
+        states[uid] = {
+          oldState: latest.oldState,
+          newState: newerState
+        };
+      };
+      return wrapped;
+    },
+    wrapGetter(fn) {
+      const wrapped = (uid, ...args) => {
+        const {
+          newState
+        } = states[uid];
+        return fn(newState, ...args);
+      };
+      return wrapped;
+    },
+    diff(uid, modules, numbers) {
+      const {
+        oldState,
+        newState
+      } = states[uid];
+      const diffResult = [];
+      for (let i = 0; i < modules.length; i++) {
+        const fn = modules[i];
+        if (!fn(oldState, newState)) {
+          diffResult.push(numbers[i]);
+        }
+      }
+      return diffResult;
+    },
+    getCommandIds() {
+      const keys = Object.keys(commandMapRef);
+      const ids = keys.map(toCommandId);
+      return ids;
+    },
+    registerCommands(commandMap) {
+      Object.assign(commandMapRef, commandMap);
+    }
+  };
+};
+const terminate = () => {
+  globalThis.close();
+};
 
 const RenderEntries = 1;
 const RenderFocusedIndex = 2;
@@ -937,24 +1028,12 @@ const diff = (oldState, newState) => {
   return diffResult;
 };
 
-const create$2 = () => {
-  const states = Object.create(null);
-  return {
-    get(uid) {
-      return states[uid];
-    },
-    set(uid, oldState, newState) {
-      states[uid] = {
-        oldState,
-        newState
-      };
-    }
-  };
-};
-
 const {
   get: get$1,
-  set: set$3
+  set: set$3,
+  getCommandIds,
+  registerCommands,
+  wrapCommand
 } = create$2();
 
 const diff2 = uid => {
@@ -965,13 +1044,23 @@ const diff2 = uid => {
   return diff(oldState, newState);
 };
 
-const commandsIds = ['closeMenu', 'handleClickAt', 'focus', 'focusFirst', 'focusIndex', 'focusLast', 'focusNext', 'focusPrevious', 'handleClick', 'handleFocus', 'handleFocusOut', 'handleKeyArrowDown', 'handleKeyArrowLeft', 'handleKeyArrowRight', 'handleKeyArrowUp', 'handleKeyEnd', 'handleKeyEnter', 'handleKeyEscape', 'handleKeyHome', 'handleKeySpace', 'handleMenuClick', 'handleMenuMouseOver', 'handleMouseOut', 'handleMouseOver', 'handlePointerOver', 'handlePointerOut', 'toggleIndex', 'toggleMenu'];
-
-const getCommandIds = () => {
-  return commandsIds;
-};
+const Menu$1 = 'menu';
+const MenuBar = 'menubar';
+const MenuItem$1 = 'menuitem';
+const MenuItemCheckBox = 'menuitemcheckbox';
+const None$1 = 'none';
+const Separator$1 = 'separator';
 
+const Button$1 = 1;
+const Div = 4;
+const Span = 8;
 const Text = 12;
+const I = 16;
+const Img = 17;
+
+const Button = 'event.button';
+const ClientX = 'event.clientX';
+const ClientY = 'event.clientY';
 
 const Escape$2 = 8;
 const Space$2 = 9;
@@ -992,6 +1081,10 @@ const mergeClassNames = (...classNames) => {
   return classNames.filter(Boolean).join(' ');
 };
 
+const px = value => {
+  return `${value}px`;
+};
+
 const text = data => {
   return {
     type: Text,
@@ -1053,7 +1146,7 @@ const i18nString = (key, placeholders = emptyObject) => {
 /**
  * @enum {string}
  */
-const UiStrings$2 = {
+const UiStrings$1 = {
   Copy: 'Copy',
   CopyLineDown: 'Copy Line Down',
   CopyLineUp: 'Copy Line Up',
@@ -1067,40 +1160,40 @@ const UiStrings$2 = {
   ToggleLineComment: 'Toggle Line Comment',
   Undo: 'Undo'};
 const cut = () => {
-  return i18nString(UiStrings$2.Cut);
+  return i18nString(UiStrings$1.Cut);
 };
 const copy = () => {
-  return i18nString(UiStrings$2.Copy);
+  return i18nString(UiStrings$1.Copy);
 };
 const paste = () => {
-  return i18nString(UiStrings$2.Paste);
+  return i18nString(UiStrings$1.Paste);
 };
 const undo = () => {
-  return i18nString(UiStrings$2.Undo);
+  return i18nString(UiStrings$1.Undo);
 };
 const redo = () => {
-  return i18nString(UiStrings$2.Redo);
+  return i18nString(UiStrings$1.Redo);
 };
 const toggleLineComment = () => {
-  return i18nString(UiStrings$2.ToggleLineComment);
+  return i18nString(UiStrings$1.ToggleLineComment);
 };
 const toggleBlockComment = () => {
-  return i18nString(UiStrings$2.ToggleBlockComment);
+  return i18nString(UiStrings$1.ToggleBlockComment);
 };
 const selectAll = () => {
-  return i18nString(UiStrings$2.SelectAll);
+  return i18nString(UiStrings$1.SelectAll);
 };
 const copyLineUp = () => {
-  return i18nString(UiStrings$2.CopyLineUp);
+  return i18nString(UiStrings$1.CopyLineUp);
 };
 const copyLineDown = () => {
-  return i18nString(UiStrings$2.CopyLineDown);
+  return i18nString(UiStrings$1.CopyLineDown);
 };
 const moveLineUp = () => {
-  return i18nString(UiStrings$2.MoveLineUp);
+  return i18nString(UiStrings$1.MoveLineUp);
 };
 const moveLineDown = () => {
-  return i18nString(UiStrings$2.MoveLineDown);
+  return i18nString(UiStrings$1.MoveLineDown);
 };
 
 const Edit$1 = 2;
@@ -1114,8 +1207,8 @@ const Terminal$1 = 14;
 const TitleBar = 15;
 const View$1 = 16;
 
-const Separator$1 = 1;
-const None$1 = 0;
+const Separator = 1;
+const None = 0;
 const SubMenu = 4;
 const Checked = 2;
 const Unchecked = 3;
@@ -1126,7 +1219,7 @@ const Ignore = 7;
 const menuEntrySeparator = {
   id: 'separator',
   label: '',
-  flags: Separator$1,
+  flags: Separator,
   command: ''
 };
 
@@ -1145,27 +1238,27 @@ const getMenuEntries$d = () => {
   }, menuEntrySeparator, {
     id: 'cut',
     label: cut(),
-    flags: None$1,
+    flags: None,
     command: /* Editor.cut */'Editor.cut'
   }, {
     id: 'copy',
     label: copy(),
-    flags: None$1,
+    flags: None,
     command: /* Editor.copy */'Editor.copy'
   }, {
     id: 'paste',
     label: paste(),
-    flags: None$1,
+    flags: None,
     command: /* Editor.paste */'Editor.paste'
   }, menuEntrySeparator, {
     id: 'toggle-line-comment',
     label: toggleLineComment(),
-    flags: None$1,
+    flags: None,
     command: /* Editor.toggleLineComment */'Editor.toggleLineComment'
   }, {
     id: 'toggle-block-comment',
     label: toggleBlockComment(),
-    flags: None$1,
+    flags: None,
     command: /* Editor.toggleBlockComment */'Editor.toggleBlockComment'
   }];
 };
@@ -1179,7 +1272,7 @@ const MenuEntriesEdit = {
 /**
  * @enum {string}
  */
-const UiStrings$1 = {
+const UiStrings = {
   NewFile: 'New File',
   NewWindow: 'New Window',
   OpenFile: 'Open File',
@@ -1190,28 +1283,28 @@ const UiStrings$1 = {
   SaveAll: 'Save All'
 };
 const newFile = () => {
-  return i18nString(UiStrings$1.NewFile);
+  return i18nString(UiStrings.NewFile);
 };
 const newWindow = () => {
-  return i18nString(UiStrings$1.NewWindow);
+  return i18nString(UiStrings.NewWindow);
 };
 const openFile = () => {
-  return i18nString(UiStrings$1.OpenFile);
+  return i18nString(UiStrings.OpenFile);
 };
 const openFolder = () => {
-  return i18nString(UiStrings$1.OpenFolder);
+  return i18nString(UiStrings.OpenFolder);
 };
 const openRecent = () => {
-  return i18nString(UiStrings$1.OpenRecent);
+  return i18nString(UiStrings.OpenRecent);
 };
 const save = () => {
-  return i18nString(UiStrings$1.Save);
+  return i18nString(UiStrings.Save);
 };
 const saveAll = () => {
-  return i18nString(UiStrings$1.SaveAll);
+  return i18nString(UiStrings.SaveAll);
 };
 const exit = () => {
-  return i18nString(UiStrings$1.Exit);
+  return i18nString(UiStrings.Exit);
 };
 
 const Web = 1;
@@ -1223,17 +1316,17 @@ const getMenuEntries$c = platform => {
   const entries = [{
     id: 'newFile',
     label: newFile(),
-    flags: None$1,
+    flags: None,
     command: '-1'
   }, {
     id: 'newWindow',
     label: newWindow(),
-    flags: None$1,
+    flags: None,
     command: /* Window.openNew */'Window.openNew'
   }, menuEntrySeparator, {
     id: 'openFile',
     label: openFile(),
-    flags: None$1,
+    flags: None,
     command: 'Dialog.openFile'
   }, {
     id: 'openFolder',
@@ -1248,12 +1341,12 @@ const getMenuEntries$c = platform => {
   }, menuEntrySeparator, {
     id: 'save',
     label: save(),
-    flags: None$1,
+    flags: None,
     command: 'Main.save'
   }, {
     id: 'saveAll',
     label: saveAll(),
-    flags: None$1,
+    flags: None,
     command: 'Main.saveAll'
   }];
   if (platform === Electron) {
@@ -1295,6 +1388,7 @@ const Help = 'Help';
 const Maximize = 'Maximize';
 const Minimize = 'Minimize';
 const MoreDot = 'More ...';
+const NewTerminal = 'New Terminal';
 const OpenProcessExplorer = 'Open Process Explorer';
 const Run = 'Run';
 const Selection = 'Selection';
@@ -1330,7 +1424,7 @@ const getMenuEntries$a = async platform => {
     entries.push({
       id: 'toggleDeveloperTools',
       label: toggleDeveloperTools(),
-      flags: None$1,
+      flags: None,
       command: 'Developer.toggleDeveloperTools'
     }, {
       id: 'openProcessExplorer',
@@ -1353,7 +1447,7 @@ const getMenuEntries$a = async platform => {
   entries.push({
     id: 'about',
     label: about(),
-    flags: None$1,
+    flags: None,
     command: 'About.showAbout'
   });
   return entries;
@@ -1459,6 +1553,11 @@ const sendMessagePortToMarkdownWorker = async (port, rpcId) => {
   // @ts-ignore
   await invokeAndTransfer('SendMessagePortToExtensionHostWorker.sendMessagePortToMarkdownWorker', port, command, rpcId);
 };
+const sendMessagePortToIconThemeWorker = async (port, rpcId) => {
+  const command = 'IconTheme.handleMessagePort';
+  // @ts-ignore
+  await invokeAndTransfer('SendMessagePortToExtensionHostWorker.sendMessagePortToIconThemeWorker', port, command, rpcId);
+};
 const sendMessagePortToFileSystemWorker = async (port, rpcId) => {
   const command = 'FileSystem.handleMessagePort';
   // @ts-ignore
@@ -1658,6 +1757,13 @@ const getLogsDir = async () => {
   // @ts-ignore
   return invoke$1('PlatformPaths.getLogsDir');
 };
+const registerMockRpc = commandMap => {
+  const mockRpc = createMockRpc({
+    commandMap
+  });
+  set$1(mockRpc);
+  return mockRpc;
+};
 
 const RendererWorker = {
   __proto__: null,
@@ -1707,6 +1813,7 @@ const RendererWorker = {
   openUrl,
   openWidget,
   readFile,
+  registerMockRpc,
   registerWebViewInterceptor,
   renderMarkdown,
   rerenderEditor,
@@ -1717,6 +1824,7 @@ const RendererWorker = {
   sendMessagePortToErrorWorker,
   sendMessagePortToExtensionHostWorker,
   sendMessagePortToFileSystemWorker,
+  sendMessagePortToIconThemeWorker,
   sendMessagePortToMarkdownWorker,
   sendMessagePortToRendererProcess,
   sendMessagePortToSearchProcess,
@@ -1776,7 +1884,7 @@ const toMenuItem = folder => {
   const label = getTitle(homeDir, folder);
   return {
     label,
-    flags: None$1,
+    flags: None,
     command: 'Workspace.setPath',
     args: [folder]
   };
@@ -1792,12 +1900,12 @@ const getMenuEntries$9 = async () => {
   items.push({
     id: 'more',
     label: moreDot(),
-    flags: None$1,
+    flags: None,
     command: 'QuickPick.showRecent'
   }, menuEntrySeparator, {
     id: 'clearRecentlyOpened',
     label: clearRecentlyOpened(),
-    flags: None$1,
+    flags: None,
     command: 'RecentlyOpened.clearRecentlyOpened'
   });
   return items;
@@ -1825,17 +1933,17 @@ const getMenuEntries$7 = () => {
   return [{
     id: 'selectAll',
     label: selectAll(),
-    flags: None$1,
+    flags: None,
     command: 'Editor.selectAll'
   }, {
     id: 'copyLineUp',
     label: copyLineUp(),
-    flags: None$1,
+    flags: None,
     command: 'Editor.copyLineUp'
   }, {
     id: 'copyLineDown',
     label: copyLineDown(),
-    flags: None$1,
+    flags: None,
     command: 'Editor.copyLineDown'
   }, {
     id: 'moveLineUp',
@@ -1856,22 +1964,12 @@ const MenuEntriesSelection = {
   id: id$3
 };
 
-/**
- * @enum {string}
- */
-const UiStrings = {
-  NewTerminal: 'New Terminal'
-};
-const newTerminal = () => {
-  return i18nString(UiStrings.NewTerminal);
-};
-
 const id$2 = Terminal$1;
 const getMenuEntries$6 = () => {
   return [{
     id: 'newTerminal',
-    label: newTerminal(),
-    flags: None$1,
+    label: i18nString(NewTerminal),
+    flags: None,
     command: 'Layout.togglePanel',
     args: ['Terminal']
   }];
@@ -1960,27 +2058,27 @@ const getMenuEntries$4 = () => {
   return [{
     id: File$2,
     label: file(),
-    flags: None$1
+    flags: None
   }, {
     id: Edit$1,
     label: edit(),
-    flags: None$1
+    flags: None
   }, {
     id: Selection$1,
     label: selection(),
-    flags: None$1
+    flags: None
   }, {
     id: View$1,
     label: view(),
-    flags: None$1
+    flags: None
   }, {
     id: Go$1,
     label: go(),
-    flags: None$1
+    flags: None
   }, {
     id: Help$1,
     label: help(),
-    flags: None$1
+    flags: None
   }];
 };
 
@@ -2028,12 +2126,6 @@ const getMenuEntries$1 = (id, platform) => {
   return menu.getMenuEntries(platform);
 };
 
-const getTitleBarButtonsWeb = () => {
-  return [];
-};
-const getTitleBarButtonsRemote = () => {
-  return [];
-};
 const getTitleBarButtonsElectron = (controlsOverlayEnabled, titleBarStyleCustom) => {
   if (controlsOverlayEnabled) {
     return [];
@@ -2059,6 +2151,15 @@ const getTitleBarButtonsElectron = (controlsOverlayEnabled, titleBarStyleCustom)
   }
   return [];
 };
+
+const getTitleBarButtonsRemote = () => {
+  return [];
+};
+
+const getTitleBarButtonsWeb = () => {
+  return [];
+};
+
 const getTitleBarButtons = (platform, controlsOverlayEnabled, titleBarStyleCustom) => {
   switch (platform) {
     case Electron:
@@ -2073,8 +2174,8 @@ const getTitleBarButtons = (platform, controlsOverlayEnabled, titleBarStyleCusto
 };
 
 const MaskIconCheck = 'MaskIconCheck';
-const Menu$1 = 'Menu';
-const MenuItem$1 = 'MenuItem';
+const Menu = 'Menu';
+const MenuItem = 'MenuItem';
 const MenuItemCheckMark = 'MenuItemCheckMark';
 const MenuItemCheckmarkIcon = 'MenuItemCheckmarkIcon';
 const MenuItemFocused = 'MenuItemFocused';
@@ -2092,24 +2193,11 @@ const TitleBarTopLevelEntry = 'TitleBarTopLevelEntry';
 const TitleBarTopLevelEntryLabel = 'TitleBarTopLevelEntryLabel';
 const Viewlet = 'Viewlet';
 
-const Menu = 'menu';
-const MenuBar = 'menubar';
-const MenuItem = 'menuitem';
-const MenuItemCheckBox = 'menuitemcheckbox';
-const None = 'none';
-const Separator = 'separator';
-
-const Button = 1;
-const Div = 4;
-const I = 16;
-const Img = 17;
-const Span = 8;
-
 const getIconVirtualDom = (icon, type = Div) => {
   return {
     type,
     className: `MaskIcon MaskIcon${icon}`,
-    role: None,
+    role: None$1,
     childCount: 0
   };
 };
@@ -2122,7 +2210,7 @@ const createTitleBarButton = button => {
     onClick
   } = button;
   const dom = [{
-    type: Button,
+    type: Button$1,
     className: `TitleBarButton TitleBarButton${id}`,
     ariaLabel: label,
     childCount: 1,
@@ -2132,20 +2220,20 @@ const createTitleBarButton = button => {
 };
 
 const getTitleBarButtonsVirtualDom = buttons => {
-  const dom = [{
+  return [{
     type: Div,
     className: mergeClassNames(Viewlet, TitleBarButtons),
     childCount: buttons.length
   }, ...buttons.flatMap(createTitleBarButton)];
-  return dom;
 };
 
+const parentNode = {
+  type: Div,
+  className: mergeClassNames(Viewlet, TitleBarIcon),
+  childCount: 1
+};
 const getTitleBarIconVirtualDom = iconSrc => {
-  return [{
-    type: Div,
-    className: mergeClassNames(Viewlet, TitleBarIcon),
-    childCount: 1
-  }, {
+  return [parentNode, {
     type: Img,
     className: TitleBarIconIcon,
     src: iconSrc,
@@ -2154,16 +2242,16 @@ const getTitleBarIconVirtualDom = iconSrc => {
   }];
 };
 
-const HandleClick = 'handleClick';
-const HandleClickMinimize = 'handleClickMinimize';
-const HandleClickToggleClose = 'handleClickToggleClose';
-const HandleClickToggleMaximize = 'handleClickToggleMaximize';
-const HandleFocusIn = 'handleFocusIn';
-const HandleFocusOut = 'handleFocusOut';
-const HandlePointerOut = 'handlePointerOut';
-const HandlePointerOver = 'handlePointerOver';
-const HandleMenuClick = 'handleMenuClick';
-const HandleMenuMouseOver = 'handleMenuMouseOver';
+const HandleClick = 1;
+const HandleClickMinimize = 2;
+const HandleClickToggleClose = 3;
+const HandleClickToggleMaximize = 4;
+const HandleFocusIn = 5;
+const HandleFocusOut = 6;
+const HandlePointerOut = 7;
+const HandlePointerOver = 8;
+const HandleMenuClick = 9;
+const HandleMenuMouseOver = 10;
 
 const getItemVirtualDom = item => {
   // @ts-ignore
@@ -2173,13 +2261,14 @@ const getItemVirtualDom = item => {
     isOpen,
     isFocused
   } = item;
+  // TODO avoid mutation
   const dom = [];
   dom.push({
     type: Div,
     className: TitleBarTopLevelEntry,
     ariaHasPopup: true,
     ariaExpanded: isOpen,
-    role: MenuItem,
+    role: MenuItem$1,
     childCount: 1,
     ariaKeyShortcuts: keyboardShortCut
   });
@@ -2252,7 +2341,8 @@ const handleClickToggleMaximize = async state => {
   return state;
 };
 
-const handleClick$1 = (state, className) => {
+// TODO use button name property
+const handleClick$1 = async (state, className) => {
   if (className.includes('Minimize')) {
     return handleClickMinimize(state);
   }
@@ -2298,7 +2388,7 @@ const getMenuHeight = items => {
   let height = CONTEXT_MENU_PADDING;
   for (const item of items) {
     switch (item.flags) {
-      case Separator$1:
+      case Separator:
         height += CONTEXT_MENU_SEPARATOR_HEIGHT;
         break;
       default:
@@ -2354,7 +2444,7 @@ const getIndexToFocusPrevious = menu => {
 };
 const canBeFocused = item => {
   switch (item.flags) {
-    case Separator$1:
+    case Separator:
     case Disabled:
       return false;
     default:
@@ -2487,7 +2577,7 @@ const handlePointerOut = (state, clientX, clientY) => {
   if (index === -1) {
     return state;
   }
-  return handleMouseOut(state, index);
+  return handleMouseOut(state);
 };
 
 const handleMouseOverMenuClosed = (state, index) => {
@@ -2511,74 +2601,46 @@ const handlePointerOver = (state, clientX, clientY) => {
   return handleMouseOver(state, index);
 };
 
-const getFontString = (fontWeight, fontSize, fontFamily) => {
-  return `${fontWeight} ${fontSize}px ${fontFamily}`;
-};
-
-const createTextMeasureContext = () => {
+const createTextMeasureContext = (letterSpacing, font) => {
   const canvas = new OffscreenCanvas(0, 0);
   const ctx = canvas.getContext('2d');
   if (!ctx) {
     throw new Error('Failed to get canvas context 2d');
   }
+  ctx.letterSpacing = letterSpacing;
+  ctx.font = font;
   return ctx;
 };
 
-const state = {
-  ctx: undefined
-};
-const getOrCreate = createCtx => {
-  if (state.ctx) {
-    return state.ctx;
-  }
-  state.ctx = createCtx();
-  return state.ctx;
-};
-
-const getContext = () => {
-  const ctx = getOrCreate(createTextMeasureContext);
-  return ctx;
-};
-
-const px = value => {
-  return `${value}px`;
+const getFontString = (fontWeight, fontSize, fontFamily) => {
+  return `${fontWeight} ${fontSize}px ${fontFamily}`;
 };
 
-const getLetterSpacingString = letterSpacing => {
-  return px(letterSpacing);
-};
-const measureTextWidth = (text, fontWeight, fontSize, fontFamily, letterSpacing, isMonoSpaceFont, charWidth) => {
-  string(text);
-  number(fontWeight);
-  number(fontSize);
-  string(fontFamily);
-  boolean(isMonoSpaceFont);
-  number(charWidth);
+const measureTextWidths = (texts, fontWeight, fontSize, fontFamily, letterSpacing) => {
   if (typeof letterSpacing !== 'number') {
     throw new TypeError('letterSpacing must be of type number');
   }
-  const letterSpacingString = getLetterSpacingString(letterSpacing);
+  const letterSpacingString = px(letterSpacing);
   const fontString = getFontString(fontWeight, fontSize, fontFamily);
-  const ctx = getContext();
-  ctx.letterSpacing = letterSpacingString;
-  ctx.font = fontString;
-  const metrics = ctx.measureText(text);
-  const {
-    width
-  } = metrics;
-  return width;
-};
-
-const measureTitleBarEntryWidth = (label, fontWeight, fontSize, fontFamily, letterSpacing) => {
-  const isMonospaceFont = false;
-  const charWidth = 0;
-  return measureTextWidth(label, fontWeight, fontSize, fontFamily, letterSpacing, isMonospaceFont, charWidth);
+  const ctx = createTextMeasureContext(letterSpacingString, fontString);
+  const widths = [];
+  for (const text of texts) {
+    const metrics = ctx.measureText(text);
+    const {
+      width
+    } = metrics;
+    widths.push(width);
+  }
+  return widths;
 };
 
 const addWidths = (entries, labelPadding, fontWeight, fontSize, fontFamily, letterSpacing) => {
+  const labels = entries.map(entry => entry.label);
+  const widths = measureTextWidths(labels, fontWeight, fontSize, fontFamily, letterSpacing);
   const withWidths = [];
-  for (const entry of entries) {
-    const textWidth = measureTitleBarEntryWidth(entry.label, fontWeight, fontSize, fontFamily, letterSpacing);
+  for (let i = 0; i < entries.length; i++) {
+    const entry = entries[i];
+    const textWidth = widths[i];
     const width = textWidth + labelPadding * 2;
     withWidths.push({
       ...entry,
@@ -2658,7 +2720,7 @@ const renderFocusedIndex = (oldState, newState) => {
 
 const checkboxChecked = {
   type: Div,
-  className: mergeClassNames(MenuItem$1, MenuItemCheckMark),
+  className: mergeClassNames(MenuItem, MenuItemCheckMark),
   role: MenuItemCheckBox,
   ariaChecked: true,
   tabIndex: -1,
@@ -2966,41 +3028,45 @@ const parseKey = rawKey => {
   };
 };
 
+const getKeyDom = key => {
+  const parsedKey = parseKey(key);
+  const keyBindingsString = getKeyBindingString(parsedKey.key, false, parsedKey.isCtrl, parsedKey.isShift);
+  return [{
+    type: Span,
+    className: MenuItemKeyBinding,
+    childCount: 1
+  }, text(keyBindingsString)];
+};
+
+const classNameFocused = mergeClassNames(MenuItem, MenuItemFocused);
+const getMenuItemClassName = isFocused => {
+  if (isFocused) {
+    return classNameFocused;
+  }
+  return MenuItem;
+};
 const getMenuItemDefaultDom = menuItem => {
   const {
     label,
     isFocused,
     key
   } = menuItem;
-  let className = MenuItem$1;
-  if (isFocused) {
-    className += ' ' + MenuItemFocused;
-  }
-  const dom = [];
-  dom.push({
+  const className = getMenuItemClassName(isFocused);
+  const keyDom = key ? getKeyDom(key) : [];
+  const childCount = key ? 2 : 1;
+  return [{
     type: Div,
     className,
-    role: MenuItem,
+    role: MenuItem$1,
     tabIndex: -1,
-    childCount: 1
-  }, text(label));
-  if (key) {
-    dom[0].childCount++;
-    const parsedKey = parseKey(key);
-    const keyBindingsString = getKeyBindingString(parsedKey.key, false, parsedKey.isCtrl, parsedKey.isShift);
-    dom.push({
-      type: Span,
-      className: MenuItemKeyBinding,
-      childCount: 1
-    }, text(keyBindingsString));
-  }
-  return dom;
+    childCount
+  }, text(label), ...keyDom];
 };
 
 const disabled = {
   type: Div,
-  className: MenuItem$1,
-  role: MenuItem,
+  className: MenuItem,
+  role: MenuItem$1,
   tabIndex: -1,
   disabled: true,
   childCount: 1
@@ -3019,7 +3085,7 @@ const getMenuItemsNoopDom = () => {
 const separator = {
   type: Div,
   className: MenuItemSeparator,
-  role: Separator,
+  role: Separator$1,
   childCount: 1
 };
 const separatorLine = {
@@ -3043,15 +3109,12 @@ const getMenuItemSubMenuDom = menuItem => {
     isExpanded,
     level
   } = menuItem;
-  let className = MenuItem$1;
-  className += ' ' + MenuItemSubMenu;
-  if (isFocused) {
-    className += ' ' + MenuItemFocused;
-  }
+  const baseClassName = mergeClassNames(MenuItem, MenuItemSubMenu);
+  const className = isFocused ? mergeClassNames(baseClassName, MenuItemFocused) : baseClassName;
   return [{
     type: Div,
     className,
-    role: MenuItem,
+    role: MenuItem$1,
     tabIndex: -1,
     ariaHasPopup: true,
     ariaExpanded: isExpanded,
@@ -3062,7 +3125,7 @@ const getMenuItemSubMenuDom = menuItem => {
 
 const checkboxUnchecked = {
   type: Div,
-  className: MenuItem$1,
+  className: MenuItem,
   role: MenuItemCheckBox,
   ariaChecked: false,
   tabIndex: -1,
@@ -3077,11 +3140,11 @@ const getMenuItemUncheckedDom = menuItem => {
 
 const getMenuItemRenderer = flags => {
   switch (flags) {
-    case None$1:
+    case None:
     case RestoreFocus:
     case Ignore:
       return getMenuItemDefaultDom;
-    case Separator$1:
+    case Separator:
       return getMenuItemSeparatorDom;
     case Checked:
       return getMenuItemCheckedDom;
@@ -3107,8 +3170,8 @@ const getMenuItemVirtualDom = menuItem => {
 const getMenuVirtualDom = menuItems => {
   const dom = [{
     type: Div,
-    className: Menu$1,
-    role: Menu,
+    className: Menu,
+    role: Menu$1,
     tabIndex: -1,
     childCount: menuItems.length
   }, ...menuItems.flatMap(getMenuItemVirtualDom)];
@@ -3215,22 +3278,22 @@ const renderEventListeners = () => {
     params: ['handleFocus']
   }, {
     name: HandleMenuClick,
-    params: ['handleMenuClick', 'event.clientX', 'event.clientY']
+    params: ['handleMenuClick', ClientX, ClientY]
   }, {
     name: HandleMenuMouseOver,
-    params: ['handleMenuMouseOver', 'event.clientX', 'event.clientY']
+    params: ['handleMenuMouseOver', ClientX, ClientY]
   }, {
     name: HandleClick,
-    params: ['handleClickAt', 'event.button', 'event.clientX', 'event.clientY']
+    params: ['handleClickAt', Button, ClientX, ClientY]
   }, {
     name: HandlePointerOut,
-    params: ['handlePointerOut', 'event.clientX', 'event.clientY']
+    params: ['handlePointerOut', ClientX, ClientY]
   }, {
     name: HandlePointerOver,
-    params: ['handlePointerOver', 'event.clientX', 'event.clientY']
+    params: ['handlePointerOver', ClientX, ClientY]
   }, {
     name: HandleFocusOut,
-    params: ['handleFocusOut', 'event.clientX', 'event.clientY'] // TODO maybe check relatedTarget
+    params: ['handleFocusOut', ClientX, ClientY] // TODO maybe check relatedTarget
   }];
 };
 
@@ -3240,12 +3303,37 @@ const saveState = uid => {
   };
 };
 
-const terminate = () => {
-  globalThis.close();
-};
+const DEFAULT_UID = 1;
+const createDefaultState = (uid = DEFAULT_UID) => ({
+  assetDir: '',
+  focusedIndex: -1,
+  height: 30,
+  iconWidth: 30,
+  isMenuOpen: false,
+  itleBarIconEnabled: true,
+  labelFontFamily: 'system-ui, Ubuntu, Droid Sans, sans-serif',
+  labelFontSize: 13,
+  labelFontWeight: 400,
+  labelLetterSpacing: 0,
+  labelPadding: 8,
+  menus: [],
+  titleBarButtonsEnabled: true,
+  titleBarButtonsWidth: 90,
+  titleBarEntries: [],
+  titleBarHeight: 30,
+  titleBarIconWidth: 30,
+  titleBarMenuBarEnabled: true,
+  titleBarTitleEnabled: true,
+  uid,
+  width: 800,
+  x: 0,
+  y: 0,
+  title: ''
+});
 
 const create = (id, uri, x, y, width, height) => {
   const state = {
+    ...createDefaultState(),
     uid: id,
     titleBarEntries: [],
     focusedIndex: -1,
@@ -3260,7 +3348,8 @@ const create = (id, uri, x, y, width, height) => {
     x,
     y,
     width,
-    height
+    height,
+    iconWidth: 30
   };
   set$3(id, state, state);
   return state;
@@ -3377,10 +3466,7 @@ const handleFocusOut = async state => {
   return state;
 };
 
-/**
- * @param {boolean} focus
- */
-const openMenu = (state, focus) => {
+const openMenu = async (state, focus) => {
   const {
     focusedIndex
   } = state;
@@ -3433,7 +3519,7 @@ const closeOneMenu = state => {
   };
 };
 
-const handleKeyArrowLeftMenuOpen = state => {
+const handleKeyArrowLeftMenuOpen = async state => {
   const {
     menus
   } = state;
@@ -3650,7 +3736,7 @@ const handleMenuClick = async (state, level, index) => {
     return state;
   }
   switch (item.flags) {
-    case None$1:
+    case None:
       return selectIndexNone(state, item);
     case SubMenu:
       return selectIndexSubMenu(state, menu, index);
@@ -3738,7 +3824,7 @@ const handleMenuMouseOver = async (state, level, index) => {
   };
 };
 
-const toggleMenu = state => {
+const toggleMenu = async state => {
   const {
     isMenuOpen
   } = state;
@@ -3748,21 +3834,6 @@ const toggleMenu = state => {
   return openMenu(state, /* focus */false);
 };
 
-const wrapCommand = fn => {
-  const wrapped = async (uid, ...args) => {
-    const {
-      newState
-    } = get$1(uid);
-    const newerState = await fn(newState, ...args);
-    if (newState === newerState) {
-      return;
-    }
-    const latest = get$1(uid);
-    set$3(uid, latest.oldState, newerState);
-  };
-  return wrapped;
-};
-
 const commandMap = {
   'TitleBar.getButtonsVirtualDom': getTitleBarButtonsVirtualDom,
   'TitleBar.getIconVirtualDom': getTitleBarIconVirtualDom,
@@ -3814,6 +3885,7 @@ const commandMap = {
 };
 
 const listen = async () => {
+  registerCommands(commandMap);
   const rpc = await WebWorkerRpcClient.create({
     commandMap: commandMap
   });