@lvce-editor/title-bar-worker 2.4.0 → 2.5.0

package/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,10 @@ 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,
+  wrapCommand
 } = create$2();
 
 const diff2 = uid => {
@@ -971,7 +1048,12 @@ const getCommandIds = () => {
   return commandsIds;
 };
 
+const Button = 1;
+const Div = 4;
+const Span = 8;
 const Text = 12;
+const I = 16;
+const Img = 17;
 
 const Escape$2 = 8;
 const Space$2 = 9;
@@ -992,6 +1074,10 @@ const mergeClassNames = (...classNames) => {
   return classNames.filter(Boolean).join(' ');
 };
 
+const px = value => {
+  return `${value}px`;
+};
+
 const text = data => {
   return {
     type: Text,
@@ -1459,6 +1545,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 +1749,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 +1805,7 @@ const RendererWorker = {
   openUrl,
   openWidget,
   readFile,
+  registerMockRpc,
   registerWebViewInterceptor,
   renderMarkdown,
   rerenderEditor,
@@ -1717,6 +1816,7 @@ const RendererWorker = {
   sendMessagePortToErrorWorker,
   sendMessagePortToExtensionHostWorker,
   sendMessagePortToFileSystemWorker,
+  sendMessagePortToIconThemeWorker,
   sendMessagePortToMarkdownWorker,
   sendMessagePortToRendererProcess,
   sendMessagePortToSearchProcess,
@@ -2099,12 +2199,6 @@ 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,
@@ -2140,12 +2234,13 @@ const getTitleBarButtonsVirtualDom = buttons => {
   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 +2249,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,6 +2268,7 @@ const getItemVirtualDom = item => {
     isOpen,
     isFocused
   } = item;
+  // TODO avoid mutation
   const dom = [];
   dom.push({
     type: Div,
@@ -2252,7 +2348,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);
   }
@@ -2487,7 +2584,7 @@ const handlePointerOut = (state, clientX, clientY) => {
   if (index === -1) {
     return state;
   }
-  return handleMouseOut(state, index);
+  return handleMouseOut(state);
 };
 
 const handleMouseOverMenuClosed = (state, index) => {
@@ -2511,74 +2608,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,
@@ -2966,16 +3035,20 @@ const parseKey = rawKey => {
   };
 };
 
+const classNameFocused = mergeClassNames(MenuItem$1, MenuItemFocused);
+const getMenuItemClassName = isFocused => {
+  if (isFocused) {
+    return classNameFocused;
+  }
+  return MenuItem$1;
+};
 const getMenuItemDefaultDom = menuItem => {
   const {
     label,
     isFocused,
     key
   } = menuItem;
-  let className = MenuItem$1;
-  if (isFocused) {
-    className += ' ' + MenuItemFocused;
-  }
+  const className = getMenuItemClassName(isFocused);
   const dom = [];
   dom.push({
     type: Div,
@@ -3240,10 +3313,6 @@ const saveState = uid => {
   };
 };
 
-const terminate = () => {
-  globalThis.close();
-};
-
 const create = (id, uri, x, y, width, height) => {
   const state = {
     uid: id,
@@ -3260,7 +3329,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 +3447,7 @@ const handleFocusOut = async state => {
   return state;
 };
 
-/**
- * @param {boolean} focus
- */
-const openMenu = (state, focus) => {
+const openMenu = async (state, focus) => {
   const {
     focusedIndex
   } = state;
@@ -3738,7 +3805,7 @@ const handleMenuMouseOver = async (state, level, index) => {
   };
 };
 
-const toggleMenu = state => {
+const toggleMenu = async state => {
   const {
     isMenuOpen
   } = state;
@@ -3748,21 +3815,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,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/title-bar-worker",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "description": "Title Bar Worker",
   "repository": {
     "type": "git",
@@ -9,5 +9,8 @@
   "license": "MIT",
   "author": "Lvce Editor",
   "type": "module",
-  "main": "dist/titleBarWorkerMain.js"
+  "main": "dist/titleBarWorkerMain.js",
+  "dependencies": {
+    "@lvce-editor/viewlet-registry": "^1.4.0"
+  }
 }