@lvce-editor/title-bar-worker 4.22.1 → 4.24.0

package/dist/titleBarWorkerMain.js

@@ -3372,6 +3372,37 @@ const hydrate = async state => {
   };
 };
 
+const getComponentState = uid => {
+  return get(uid).newState;
+};
+
+const MaskIconCheck = 'MaskIconCheck';
+const MaskIcon = 'MaskIcon';
+const Menu = 'Menu';
+const MenuItem = 'MenuItem';
+const MenuItemCheckMark = 'MenuItemCheckMark';
+const MenuItemCheckmarkIcon = 'MenuItemCheckmarkIcon';
+const MenuItemDisabled = 'MenuItemDisabled';
+const MenuItemFocused = 'MenuItemFocused';
+const MenuItemKeyBinding = 'MenuItemKeyBinding';
+const MenuItemSeparator = 'MenuItemSeparator';
+const MenuItemSeparatorLine = 'MenuItemSeparatorLine';
+const MenuItemSubMenu = 'MenuItemSubMenu';
+const MenuItemSubMenuArrowRight = 'MenuItemSubMenuArrowRight';
+const TitleBar = 'TitleBar';
+const TitleBarButton = 'TitleBarButton';
+const TitleBarButtons = 'TitleBarButtons';
+const TitleBarCommandCenter = 'TitleBarCommandCenter';
+const TitleBarEntryActive = 'TitleBarEntryActive';
+const TitleBarIcon = 'TitleBarIcon';
+const TitleBarIconIcon = 'TitleBarIconIcon';
+const TitleBarMenuBar = 'TitleBarMenuBar';
+const TitleBarTopLevelEntry = 'TitleBarTopLevelEntry';
+const TitleBarTopLevelEntryLabel = 'TitleBarTopLevelEntryLabel';
+const Viewlet = 'Viewlet';
+
+const Focusable = 0;
+
 const mergeClassNames = (...classNames) => {
   return classNames.filter(Boolean).join(' ');
 };
@@ -3386,6 +3417,263 @@ const text = data => {
 
 new Set(Object.values(VirtualDomElements));
 
+const getCommandCenterVirtualDom = commandCenterEnabled => {
+  if (!commandCenterEnabled) {
+    return [];
+  }
+  return [{
+    ariaLabel: commandCenter(),
+    childCount: 1,
+    className: TitleBarCommandCenter,
+    onClick: HandleCommandCenterClick,
+    onKeyDown: HandleCommandCenterKeyDown,
+    role: Button$2,
+    tabIndex: Focusable,
+    type: Div
+  }, text(search())];
+};
+
+const getIcon = assetDir => {
+  return `${assetDir}/icons/icon.svg`;
+};
+
+const getIconVirtualDom = (icon, type = Div) => {
+  return {
+    childCount: 0,
+    className: mergeClassNames(MaskIcon, `MaskIcon${icon}`),
+    role: None$1,
+    type
+  };
+};
+
+const createTitleBarButton = button => {
+  const {
+    icon,
+    id,
+    label,
+    onClick
+  } = button;
+  const dom = [{
+    ariaLabel: label,
+    childCount: 1,
+    className: mergeClassNames(TitleBarButton, `TitleBarButton${id}`),
+    name: id,
+    onClick,
+    type: Button$1
+  }, getIconVirtualDom(icon, I)];
+  return dom;
+};
+
+const getTitleBarButtonsVirtualDom = (buttonsEnabled, buttons) => {
+  if (!buttonsEnabled) {
+    return [];
+  }
+  return [{
+    childCount: buttons.length,
+    className: mergeClassNames(Viewlet, TitleBarButtons),
+    type: Div
+  }, ...buttons.flatMap(createTitleBarButton)];
+};
+
+const parentNode$1 = {
+  childCount: 1,
+  className: mergeClassNames(Viewlet, TitleBarIcon),
+  type: Div
+};
+const getTitleBarIconVirtualDom = (titleBarIconEnabled, iconSrc) => {
+  if (!titleBarIconEnabled) {
+    return [];
+  }
+  return [parentNode$1, {
+    alt: '',
+    childCount: 0,
+    className: TitleBarIconIcon,
+    src: iconSrc,
+    type: Img
+  }];
+};
+
+const activeEntryLabelNode = {
+  childCount: 1,
+  className: TitleBarTopLevelEntryLabel,
+  type: Div
+};
+const getActiveEntryLabelDom = isFocused => {
+  if (!isFocused) {
+    return [];
+  }
+  return [activeEntryLabelNode];
+};
+const getItemVirtualDom = item => {
+  const {
+    ariaLabel,
+    isFocused,
+    isOpen,
+    keyboardShortCut,
+    label
+  } = item;
+  const className = isFocused ? mergeClassNames(TitleBarTopLevelEntry, TitleBarEntryActive) : TitleBarTopLevelEntry;
+  return [{
+    ariaExpanded: isOpen,
+    ariaHasPopup: true,
+    ariaKeyShortcuts: keyboardShortCut,
+    ariaLabel: ariaLabel || label,
+    ariaOwns: isOpen ? 'Menu-0' : undefined,
+    childCount: 1,
+    className,
+    id: isFocused ? 'TitleBarEntryActive' : undefined,
+    name: label,
+    // TODO have separate name attribute
+    role: MenuItem$1,
+    type: Button$1
+  }, ...getActiveEntryLabelDom(isFocused), text(label)];
+};
+const getTitleBarMenuBarItemsVirtualDom = visibleItems => {
+  const dom = visibleItems.flatMap(getItemVirtualDom);
+  return dom;
+};
+
+const activeId = 'TitleBarEntryActive';
+const getTitleBarMenuBarVirtualDom = (menuBarEnabled, visibleItems, focusedIndex) => {
+  if (!menuBarEnabled) {
+    return [];
+  }
+  return [{
+    ariaActivedescendant: focusedIndex === -1 ? '' : activeId,
+    childCount: visibleItems.length,
+    className: mergeClassNames(Viewlet, TitleBarMenuBar),
+    onContextMenu: HandleContextMenu,
+    onFocusIn: HandleFocusIn,
+    onFocusOut: HandleFocusOut,
+    onMouseDown: HandleClick,
+    onPointerOut: HandlePointerOut,
+    onPointerOver: HandlePointerOver,
+    role: MenuBar$1,
+    tabIndex: 0,
+    type: Div
+  }, ...getTitleBarMenuBarItemsVirtualDom(visibleItems)];
+};
+
+const parentNode = {
+  childCount: 1,
+  className: 'TitleBarTitle',
+  type: Div
+};
+const getTitleVirtualDom = (titleBarTitleEnabled, title) => {
+  if (!titleBarTitleEnabled) {
+    return [];
+  }
+  return [parentNode, text(title)];
+};
+
+const Ellipsis = 'Ellipsis';
+
+const MoreEntryWidth = 38;
+const OverflowMenuId = 'title-bar-overflow';
+const getTotalWidth$1 = entries => {
+  let total = 0;
+  for (const entry of entries) {
+    total += entry.width;
+  }
+  return total;
+};
+const createOverflowEntry = (hiddenEntries, overflowIndex, focusedIndex, isMenuOpen) => {
+  return {
+    ariaLabel: moreDot(),
+    hiddenEntries,
+    icon: Ellipsis,
+    id: OverflowMenuId,
+    isFocused: overflowIndex === focusedIndex,
+    isOpen: overflowIndex === focusedIndex && isMenuOpen,
+    label: '...',
+    width: MoreEntryWidth
+  };
+};
+const isOverflowTitleBarEntry = entry => {
+  return entry.id === OverflowMenuId;
+};
+const getVisibleTitleBarEntries = (entries, width, focusedIndex, isMenuOpen) => {
+  array(entries);
+  number(width);
+  let total = 0;
+  const visible = [];
+  for (let i = 0; i < entries.length; i++) {
+    const entry = entries[i];
+    const nextTotal = total + entry.width;
+    if (nextTotal >= width) {
+      break;
+    }
+    total = nextTotal;
+    const visibleIndex = visible.length;
+    const isOpen = visibleIndex === focusedIndex && isMenuOpen;
+    const isFocused = visibleIndex === focusedIndex;
+    visible.push({
+      ...entry,
+      isFocused,
+      isOpen
+    });
+  }
+  const hasOverflow = visible.length < entries.length;
+  if (hasOverflow) {
+    while (visible.length > 0 && getTotalWidth$1(visible) + MoreEntryWidth > width) {
+      visible.pop();
+    }
+    const hiddenEntries = entries.slice(visible.length);
+    const overflowIndex = visible.length;
+    visible.push(createOverflowEntry(hiddenEntries, overflowIndex, focusedIndex, isMenuOpen));
+  }
+  return visible;
+};
+
+const emptyTitleBarNode = {
+  childCount: 0,
+  type: Div
+};
+const getTitleBarVirtualDom = state => {
+  const {
+    assetDir,
+    commandCenterEnabled,
+    focusedIndex,
+    isMenuOpen,
+    platform,
+    title,
+    titleBarButtons,
+    titleBarButtonsEnabled,
+    titleBarEntries,
+    titleBarIconEnabled,
+    titleBarMenuBarEnabled,
+    titleBarStyleCustom,
+    titleBarTitleEnabled,
+    width
+  } = state;
+  if (platform === Electron$1 && !titleBarStyleCustom) {
+    return [emptyTitleBarNode];
+  }
+  const iconSrc = getIcon(assetDir);
+  const visibleEntries = getVisibleTitleBarEntries(titleBarEntries, width, focusedIndex, isMenuOpen);
+  const titleEnabled = titleBarTitleEnabled && !commandCenterEnabled;
+  const childCount = Number(titleBarIconEnabled) + Number(titleBarMenuBarEnabled) + Number(commandCenterEnabled) + Number(titleEnabled) + Number(titleBarButtonsEnabled);
+  return [{
+    ariaLabel: titleBar(),
+    childCount,
+    className: mergeClassNames(Viewlet, TitleBar),
+    id: 'TitleBar',
+    onContextMenu: HandleTitleBarContextMenu,
+    role: ContentInfo,
+    type: Div
+  }, ...getTitleBarIconVirtualDom(titleBarIconEnabled, iconSrc), ...getTitleBarMenuBarVirtualDom(titleBarMenuBarEnabled, visibleEntries, focusedIndex), ...getCommandCenterVirtualDom(commandCenterEnabled), ...getTitleVirtualDom(titleEnabled, title), ...getTitleBarButtonsVirtualDom(titleBarButtonsEnabled, titleBarButtons)];
+};
+
+const renderTitleBar = (oldState, newState) => {
+  const dom = getTitleBarVirtualDom(newState);
+  return [SetDom2, newState.uid, dom];
+};
+
+const getComponentDom = uid => {
+  const state = getComponentState(uid);
+  return renderTitleBar(state, state)[2];
+};
+
 const getKeyBindings = () => {
   return [{
     command: 'TitleBar.handleKeyArrowDown',
@@ -3568,90 +3856,31 @@ const handleMessagePort = async (port, viewletCommandMap, setAsRendererProcess =
     } = Promise.withResolvers();
     commandQueues.set(uid, next);
     if (previous) {
-      await previous;
-    }
-    try {
-      await fn(uid, ...args);
-      await invoke$1('Viewlet.requestRender', uid);
-    } finally {
-      resolve();
-      if (commandQueues.get(uid) === next) {
-        commandQueues.delete(uid);
-      }
-    }
-  };
-  const rpc = await create$5({
-    commandMap: {
-      'Viewlet.executeViewletCommand': executeViewletCommand
-    },
-    messagePort: port
-  });
-  if (setAsRendererProcess) {
-    set(rpc);
-  }
-};
-
-const getMenuOffset = (x, clientX, iconWidth) => {
-  return clientX - x - iconWidth;
-};
-
-const Ellipsis = 'Ellipsis';
-
-const MoreEntryWidth = 38;
-const OverflowMenuId = 'title-bar-overflow';
-const getTotalWidth$1 = entries => {
-  let total = 0;
-  for (const entry of entries) {
-    total += entry.width;
-  }
-  return total;
-};
-const createOverflowEntry = (hiddenEntries, overflowIndex, focusedIndex, isMenuOpen) => {
-  return {
-    ariaLabel: moreDot(),
-    hiddenEntries,
-    icon: Ellipsis,
-    id: OverflowMenuId,
-    isFocused: overflowIndex === focusedIndex,
-    isOpen: overflowIndex === focusedIndex && isMenuOpen,
-    label: '...',
-    width: MoreEntryWidth
-  };
-};
-const isOverflowTitleBarEntry = entry => {
-  return entry.id === OverflowMenuId;
-};
-const getVisibleTitleBarEntries = (entries, width, focusedIndex, isMenuOpen) => {
-  array(entries);
-  number(width);
-  let total = 0;
-  const visible = [];
-  for (let i = 0; i < entries.length; i++) {
-    const entry = entries[i];
-    const nextTotal = total + entry.width;
-    if (nextTotal >= width) {
-      break;
-    }
-    total = nextTotal;
-    const visibleIndex = visible.length;
-    const isOpen = visibleIndex === focusedIndex && isMenuOpen;
-    const isFocused = visibleIndex === focusedIndex;
-    visible.push({
-      ...entry,
-      isFocused,
-      isOpen
-    });
-  }
-  const hasOverflow = visible.length < entries.length;
-  if (hasOverflow) {
-    while (visible.length > 0 && getTotalWidth$1(visible) + MoreEntryWidth > width) {
-      visible.pop();
+      await previous;
     }
-    const hiddenEntries = entries.slice(visible.length);
-    const overflowIndex = visible.length;
-    visible.push(createOverflowEntry(hiddenEntries, overflowIndex, focusedIndex, isMenuOpen));
+    try {
+      await fn(uid, ...args);
+      await invoke$1('Viewlet.requestRender', uid);
+    } finally {
+      resolve();
+      if (commandQueues.get(uid) === next) {
+        commandQueues.delete(uid);
+      }
+    }
+  };
+  const rpc = await create$5({
+    commandMap: {
+      'Viewlet.executeViewletCommand': executeViewletCommand
+    },
+    messagePort: port
+  });
+  if (setAsRendererProcess) {
+    set(rpc);
   }
-  return visible;
+};
+
+const getMenuOffset = (x, clientX, iconWidth) => {
+  return clientX - x - iconWidth;
 };
 
 const getNavigableTitleBarEntries = state => {
@@ -4184,31 +4413,6 @@ const renderFocusedIndex = (oldState, newState) => {
   return [FocusSelector, newState.uid, '.ViewletTitleBarMenuBar'];
 };
 
-const MaskIconCheck = 'MaskIconCheck';
-const MaskIcon = 'MaskIcon';
-const Menu = 'Menu';
-const MenuItem = 'MenuItem';
-const MenuItemCheckMark = 'MenuItemCheckMark';
-const MenuItemCheckmarkIcon = 'MenuItemCheckmarkIcon';
-const MenuItemDisabled = 'MenuItemDisabled';
-const MenuItemFocused = 'MenuItemFocused';
-const MenuItemKeyBinding = 'MenuItemKeyBinding';
-const MenuItemSeparator = 'MenuItemSeparator';
-const MenuItemSeparatorLine = 'MenuItemSeparatorLine';
-const MenuItemSubMenu = 'MenuItemSubMenu';
-const MenuItemSubMenuArrowRight = 'MenuItemSubMenuArrowRight';
-const TitleBar = 'TitleBar';
-const TitleBarButton = 'TitleBarButton';
-const TitleBarButtons = 'TitleBarButtons';
-const TitleBarCommandCenter = 'TitleBarCommandCenter';
-const TitleBarEntryActive = 'TitleBarEntryActive';
-const TitleBarIcon = 'TitleBarIcon';
-const TitleBarIconIcon = 'TitleBarIconIcon';
-const TitleBarMenuBar = 'TitleBarMenuBar';
-const TitleBarTopLevelEntry = 'TitleBarTopLevelEntry';
-const TitleBarTopLevelEntryLabel = 'TitleBarTopLevelEntryLabel';
-const Viewlet = 'Viewlet';
-
 const getKeyBindingString = (key, altKey, ctrlKey, shiftKey, metaKey) => {
   let string = '';
   if (ctrlKey) {
@@ -4490,201 +4694,6 @@ const renderMenus = (oldState, newState) => {
   return ['Viewlet.send', uid, /* method */SetMenus, /* changes */changes, uid];
 };
 
-const Focusable = 0;
-
-const getCommandCenterVirtualDom = commandCenterEnabled => {
-  if (!commandCenterEnabled) {
-    return [];
-  }
-  return [{
-    ariaLabel: commandCenter(),
-    childCount: 1,
-    className: TitleBarCommandCenter,
-    onClick: HandleCommandCenterClick,
-    onKeyDown: HandleCommandCenterKeyDown,
-    role: Button$2,
-    tabIndex: Focusable,
-    type: Div
-  }, text(search())];
-};
-
-const getIcon = assetDir => {
-  return `${assetDir}/icons/icon.svg`;
-};
-
-const getIconVirtualDom = (icon, type = Div) => {
-  return {
-    childCount: 0,
-    className: mergeClassNames(MaskIcon, `MaskIcon${icon}`),
-    role: None$1,
-    type
-  };
-};
-
-const createTitleBarButton = button => {
-  const {
-    icon,
-    id,
-    label,
-    onClick
-  } = button;
-  const dom = [{
-    ariaLabel: label,
-    childCount: 1,
-    className: mergeClassNames(TitleBarButton, `TitleBarButton${id}`),
-    name: id,
-    onClick,
-    type: Button$1
-  }, getIconVirtualDom(icon, I)];
-  return dom;
-};
-
-const getTitleBarButtonsVirtualDom = (buttonsEnabled, buttons) => {
-  if (!buttonsEnabled) {
-    return [];
-  }
-  return [{
-    childCount: buttons.length,
-    className: mergeClassNames(Viewlet, TitleBarButtons),
-    type: Div
-  }, ...buttons.flatMap(createTitleBarButton)];
-};
-
-const parentNode$1 = {
-  childCount: 1,
-  className: mergeClassNames(Viewlet, TitleBarIcon),
-  type: Div
-};
-const getTitleBarIconVirtualDom = (titleBarIconEnabled, iconSrc) => {
-  if (!titleBarIconEnabled) {
-    return [];
-  }
-  return [parentNode$1, {
-    alt: '',
-    childCount: 0,
-    className: TitleBarIconIcon,
-    src: iconSrc,
-    type: Img
-  }];
-};
-
-const activeEntryLabelNode = {
-  childCount: 1,
-  className: TitleBarTopLevelEntryLabel,
-  type: Div
-};
-const getActiveEntryLabelDom = isFocused => {
-  if (!isFocused) {
-    return [];
-  }
-  return [activeEntryLabelNode];
-};
-const getItemVirtualDom = item => {
-  const {
-    ariaLabel,
-    isFocused,
-    isOpen,
-    keyboardShortCut,
-    label
-  } = item;
-  const className = isFocused ? mergeClassNames(TitleBarTopLevelEntry, TitleBarEntryActive) : TitleBarTopLevelEntry;
-  return [{
-    ariaExpanded: isOpen,
-    ariaHasPopup: true,
-    ariaKeyShortcuts: keyboardShortCut,
-    ariaLabel: ariaLabel || label,
-    ariaOwns: isOpen ? 'Menu-0' : undefined,
-    childCount: 1,
-    className,
-    id: isFocused ? 'TitleBarEntryActive' : undefined,
-    name: label,
-    // TODO have separate name attribute
-    role: MenuItem$1,
-    type: Button$1
-  }, ...getActiveEntryLabelDom(isFocused), text(label)];
-};
-const getTitleBarMenuBarItemsVirtualDom = visibleItems => {
-  const dom = visibleItems.flatMap(getItemVirtualDom);
-  return dom;
-};
-
-const activeId = 'TitleBarEntryActive';
-const getTitleBarMenuBarVirtualDom = (menuBarEnabled, visibleItems, focusedIndex) => {
-  if (!menuBarEnabled) {
-    return [];
-  }
-  return [{
-    ariaActivedescendant: focusedIndex === -1 ? '' : activeId,
-    childCount: visibleItems.length,
-    className: mergeClassNames(Viewlet, TitleBarMenuBar),
-    onContextMenu: HandleContextMenu,
-    onFocusIn: HandleFocusIn,
-    onFocusOut: HandleFocusOut,
-    onMouseDown: HandleClick,
-    onPointerOut: HandlePointerOut,
-    onPointerOver: HandlePointerOver,
-    role: MenuBar$1,
-    tabIndex: 0,
-    type: Div
-  }, ...getTitleBarMenuBarItemsVirtualDom(visibleItems)];
-};
-
-const parentNode = {
-  childCount: 1,
-  className: 'TitleBarTitle',
-  type: Div
-};
-const getTitleVirtualDom = (titleBarTitleEnabled, title) => {
-  if (!titleBarTitleEnabled) {
-    return [];
-  }
-  return [parentNode, text(title)];
-};
-
-const emptyTitleBarNode = {
-  childCount: 0,
-  type: Div
-};
-const getTitleBarVirtualDom = state => {
-  const {
-    assetDir,
-    commandCenterEnabled,
-    focusedIndex,
-    isMenuOpen,
-    platform,
-    title,
-    titleBarButtons,
-    titleBarButtonsEnabled,
-    titleBarEntries,
-    titleBarIconEnabled,
-    titleBarMenuBarEnabled,
-    titleBarStyleCustom,
-    titleBarTitleEnabled,
-    width
-  } = state;
-  if (platform === Electron$1 && !titleBarStyleCustom) {
-    return [emptyTitleBarNode];
-  }
-  const iconSrc = getIcon(assetDir);
-  const visibleEntries = getVisibleTitleBarEntries(titleBarEntries, width, focusedIndex, isMenuOpen);
-  const titleEnabled = titleBarTitleEnabled && !commandCenterEnabled;
-  const childCount = Number(titleBarIconEnabled) + Number(titleBarMenuBarEnabled) + Number(commandCenterEnabled) + Number(titleEnabled) + Number(titleBarButtonsEnabled);
-  return [{
-    ariaLabel: titleBar(),
-    childCount,
-    className: mergeClassNames(Viewlet, TitleBar),
-    id: 'TitleBar',
-    onContextMenu: HandleTitleBarContextMenu,
-    role: ContentInfo,
-    type: Div
-  }, ...getTitleBarIconVirtualDom(titleBarIconEnabled, iconSrc), ...getTitleBarMenuBarVirtualDom(titleBarMenuBarEnabled, visibleEntries, focusedIndex), ...getCommandCenterVirtualDom(commandCenterEnabled), ...getTitleVirtualDom(titleEnabled, title), ...getTitleBarButtonsVirtualDom(titleBarButtonsEnabled, titleBarButtons)];
-};
-
-const renderTitleBar = (oldState, newState) => {
-  const dom = getTitleBarVirtualDom(newState);
-  return [SetDom2, newState.uid, dom];
-};
-
 const getRenderer3 = diffType => {
   switch (diffType) {
     case RenderEntries:
@@ -4802,6 +4811,23 @@ const saveState = state => {
   };
 };
 
+const applyComponentState = (currentState, state) => {
+  if (!state || typeof state !== 'object' || Array.isArray(state)) {
+    throw new TypeError('Title Bar state must be an object');
+  }
+  const {
+    uid
+  } = state;
+  const {
+    uid: currentUid
+  } = currentState;
+  if (uid !== currentUid) {
+    throw new Error(`Title Bar state uid must remain ${currentUid}`);
+  }
+  return state;
+};
+const setComponentState = wrapCommand(applyComponentState);
+
 const setPlatform = (state, platform) => {
   return {
     ...state,
@@ -5522,6 +5548,8 @@ const commandMap = {
   'TitleBar.focusPrevious': wrapCommand(focusPrevious),
   'TitleBar.getCommandIds': getCommandIds,
   'TitleBar.getCommands': getCommandIds,
+  'TitleBar.getComponentDom': getComponentDom,
+  'TitleBar.getComponentState': getComponentState,
   'TitleBar.getKeyBindings': getKeyBindings,
   'TitleBar.getMenuEntries2': wrapGetter(getMenuEntries2),
   'TitleBar.getMenuIds': getMenuIds,
@@ -5563,6 +5591,7 @@ const commandMap = {
   'TitleBar.renderEventListeners': renderEventListeners,
   'TitleBar.resize': wrapCommand(resize),
   'TitleBar.saveState': wrapGetter(saveState),
+  'TitleBar.setComponentState': setComponentState,
   'TitleBar.setPlatform': wrapCommand(setPlatform),
   'TitleBar.setTitleTemplate': wrapCommand(setTitleTemplate),
   'TitleBar.setWidth': wrapCommand(setWidth),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/title-bar-worker",
-  "version": "4.22.1",
+  "version": "4.24.0",
   "description": "Title Bar Worker",
   "repository": {
     "type": "git",