@lvce-editor/activity-bar-worker 7.26.0 → 7.27.1

package/dist/activityBarWorkerMain.js

@@ -249,7 +249,7 @@ const {
   get: get$2,
   getCommandIds,
   registerCommands,
-  set: set$5,
+  set: set$6,
   wrapAsyncCommand,
   wrapCommand,
   wrapGetter
@@ -261,6 +261,7 @@ const create$9 = (id, uri, x, y, width, height, args, parentUid, platform = 0) =
     accountEnabled: true,
     activityBarItems: [],
     currentViewletId: '',
+    dragAndDropEnabled: false,
     filteredItems: [],
     focus: 0,
     focused: false,
@@ -284,7 +285,7 @@ const create$9 = (id, uri, x, y, width, height, args, parentUid, platform = 0) =
     x,
     y
   };
-  set$5(id, state, state);
+  set$6(id, state, state);
   return state;
 };
 
@@ -297,16 +298,20 @@ const getCustomIconSignature = items => {
   }).filter(Boolean).join('\n');
 };
 
-const isEqual$2 = (oldState, newState) => {
+const isEqual$3 = (oldState, newState) => {
   return oldState.itemHeight === newState.itemHeight && getCustomIconSignature(oldState.filteredItems) === getCustomIconSignature(newState.filteredItems);
 };
 
+const isEqual$2 = (oldState, newState) => {
+  return oldState.draggedItemId === newState.draggedItemId;
+};
+
 const isEqual$1 = (oldState, newState) => {
   return oldState.focused === newState.focused && oldState.focus === newState.focus;
 };
 
 const isEqual = (oldState, newState) => {
-  return oldState.activityBarItems === newState.activityBarItems && oldState.filteredItems === newState.filteredItems && oldState.focused === newState.focused && oldState.focusedIndex === newState.focusedIndex && oldState.sideBarLocation === newState.sideBarLocation && oldState.sideBarVisible === newState.sideBarVisible && oldState.updateProgress === newState.updateProgress && oldState.updateState === newState.updateState;
+  return oldState.activityBarItems === newState.activityBarItems && oldState.dragAndDropEnabled === newState.dragAndDropEnabled && oldState.draggedItemId === newState.draggedItemId && oldState.dropIndicator === newState.dropIndicator && oldState.filteredItems === newState.filteredItems && oldState.focused === newState.focused && oldState.focusedIndex === newState.focusedIndex && oldState.sideBarLocation === newState.sideBarLocation && oldState.sideBarVisible === newState.sideBarVisible && oldState.updateProgress === newState.updateProgress && oldState.updateState === newState.updateState;
 };
 
 const RenderItems = 4;
@@ -314,9 +319,10 @@ const RenderFocus = 6;
 const RenderFocusContext = 7;
 const RenderCss = 11;
 const RenderIncremental = 12;
+const RenderDragData = 13;
 
-const modules = [isEqual, isEqual$1, isEqual$1, isEqual$2];
-const numbers = [RenderIncremental, RenderFocus, RenderFocusContext, RenderCss];
+const modules = [isEqual, isEqual$1, isEqual$1, isEqual$3, isEqual$2];
+const numbers = [RenderIncremental, RenderFocus, RenderFocusContext, RenderCss, RenderDragData];
 
 const diff2 = uid => {
   return diff(uid, modules, numbers);
@@ -593,6 +599,7 @@ const LeftClick = 0;
 
 const Electron = 2;
 
+const DragAndDropWorker = 3404;
 const ExtensionManagementWorker = 9006;
 const RendererProcess = 1670;
 const RendererWorker = 1;
@@ -1495,6 +1502,9 @@ const restoreExistingError = (error, currentStack) => {
 };
 const restoreMethodNotFoundError = (error, currentStack) => {
   const restoredError = new JsonRpcError(error.message);
+  Object.assign(restoredError, {
+    code: error.code
+  });
   const parentStack = getParentStack(error);
   setStack(restoredError, `${parentStack}${NewLine}${currentStack}`);
   return restoredError;
@@ -1514,9 +1524,13 @@ const applyDataProperties = (restoredError, error) => {
     // @ts-ignore
     restoredError.codeFrame = error.data.codeFrame;
   }
-  if (error.data.code) {
+  if (typeof error.data.code === 'string' || typeof error.data.code === 'number') {
     // @ts-ignore
-    restoredError.code = error.data.code;
+    Object.defineProperty(restoredError, 'code', {
+      configurable: true,
+      value: error.data.code,
+      writable: true
+    });
   }
   if (error.data.type) {
     // @ts-ignore
@@ -1538,6 +1552,13 @@ const applyDirectProperties = (restoredError, error) => {
 };
 const restoreMessageError = (error, _currentStack) => {
   const restoredError = constructError(error.message, error.type, error.name);
+  if (typeof error.code === 'string' || typeof error.code === 'number') {
+    Object.defineProperty(restoredError, 'code', {
+      configurable: true,
+      value: error.code,
+      writable: true
+    });
+  }
   if (error.data) {
     applyDataProperties(restoredError, error);
   } else {
@@ -1616,7 +1637,7 @@ const getErrorProperty = (error, prettyError) => {
   return {
     code: Custom,
     data: {
-      code: prettyError.code,
+      code: prettyError.code ?? error?.code,
       codeFrame: prettyError.codeFrame,
       name: prettyError.name,
       stack: getStack(prettyError),
@@ -1653,7 +1674,12 @@ const getErrorResponseSimple = (id, error) => {
   return {
     error: {
       code: Custom,
-      data: error,
+      data: error instanceof Error ? {
+        ...error,
+        code: 'code' in error ? error.code : undefined,
+        stack: error.stack,
+        type: error.name
+      } : error,
       // @ts-ignore
       message: error.message
     },
@@ -1967,7 +1993,7 @@ const createMockRpc = ({
 };
 
 const rpcs = Object.create(null);
-const set$4 = (id, rpc) => {
+const set$5 = (id, rpc) => {
   rpcs[id] = rpc;
 };
 const get = id => {
@@ -2000,7 +2026,7 @@ const create = rpcId => {
       const mockRpc = createMockRpc({
         commandMap
       });
-      set$4(rpcId, mockRpc);
+      set$5(rpcId, mockRpc);
       // @ts-ignore
       mockRpc[Symbol.dispose] = () => {
         remove(rpcId);
@@ -2009,11 +2035,16 @@ const create = rpcId => {
       return mockRpc;
     },
     set(rpc) {
-      set$4(rpcId, rpc);
+      set$5(rpcId, rpc);
     }
   };
 };
 
+const {
+  invoke: invoke$4,
+  set: set$4
+} = create(DragAndDropWorker);
+
 const {
   invoke: invoke$3,
   set: set$3
@@ -2021,12 +2052,13 @@ const {
 
 const {
   invoke: invoke$2,
+  invokeAndTransfer: invokeAndTransfer$2,
   set: set$2
 } = create(RendererProcess);
 
 const {
   invoke: invoke$1,
-  invokeAndTransfer,
+  invokeAndTransfer: invokeAndTransfer$1,
   set: set$1
 } = create(RendererWorker);
 const showContextMenu2 = async (uid, menuId, x, y, args) => {
@@ -2038,7 +2070,7 @@ const showContextMenu2 = async (uid, menuId, x, y, args) => {
 };
 const sendMessagePortToExtensionManagementWorker = async (port, rpcId) => {
   const command = 'Extensions.handleMessagePort';
-  await invokeAndTransfer('SendMessagePortToExtensionHostWorker.sendMessagePortToExtensionManagementWorker', port, command, rpcId);
+  await invokeAndTransfer$1('SendMessagePortToExtensionHostWorker.sendMessagePortToExtensionManagementWorker', port, command, rpcId);
 };
 
 const show2 = async (uid, menuId, x, y, args) => {
@@ -2174,6 +2206,10 @@ const getActiveViewIds = items => {
   return items.filter(item => item.flags & Selected).map(item => item.id);
 };
 
+const Default = 0;
+const Preview = 1;
+const SideBar = 2;
+
 const Account = 'Account';
 const DebugAlt2 = 'DebugAlt2';
 const Extensions$1 = 'Extensions';
@@ -2194,10 +2230,17 @@ const getFilteredActivityBarItems = (items, height, itemHeight) => {
     return enabledItems;
   }
   const showMoreItem = {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: Button,
+    hasPopup: false,
     icon: Ellipsis,
     id: 'Additional Views',
     keyShortcuts: '',
+    preferredLocation: Default,
     title: additionalViews()
   };
   return [...enabledItems.slice(0, numberOfVisibleItems - 2), showMoreItem, enabledItems.at(-1)];
@@ -2308,14 +2351,14 @@ const handleBlur = state => {
   };
 };
 
-const isBottomItem$1 = item => {
+const isBottomItem$3 = item => {
   return item.id === 'Account' || item.id === 'Settings';
 };
 const getBottomItemCount = items => {
   if (typeof items === 'number') {
     return items > 1 ? 1 : 0;
   }
-  return items.filter(isBottomItem$1).length;
+  return items.filter(isBottomItem$3).length;
 };
 const getItemCount = items => {
   if (typeof items === 'number') {
@@ -2410,7 +2453,7 @@ const handleClickOther = async (state, viewletId) => {
   const selectedItem = activityBarItems.find(item => item.id === viewletId);
   const sideBarChange = getSideBarChange(sideBarVisible, currentViewletId, viewletId);
   await toggle(viewletId);
-  if (selectedItem?.preferredLocation === 'preview') {
+  if (selectedItem?.preferredLocation === Preview) {
     const isActive = activeViewIds.includes(viewletId);
     const newActiveViewIds = isActive ? activeViewIds.filter(id => id !== viewletId) : [...activeViewIds, viewletId];
     const newActivityBarItems = markActiveViews(activityBarItems, newActiveViewIds);
@@ -2541,6 +2584,163 @@ const handleContextMenu = async (context, button, eventX, eventY) => {
   });
 };
 
+const handleDragEnd = state => {
+  const {
+    draggedItemId,
+    dropIndicator
+  } = state;
+  if (!draggedItemId && !dropIndicator) {
+    return state;
+  }
+  return {
+    ...state,
+    draggedItemId: undefined,
+    dropIndicator: undefined
+  };
+};
+
+const handleDragLeave = state => {
+  const {
+    dropIndicator
+  } = state;
+  if (!dropIndicator) {
+    return state;
+  }
+  return {
+    ...state,
+    dropIndicator: undefined
+  };
+};
+
+const isMovableActivityBarItem = item => {
+  return Boolean(item && item.flags & Tab && item.id !== 'Additional Views');
+};
+
+const isBottomItem$2 = item => item.id === 'Account' || item.id === 'Settings';
+const getDropIndicator = (state, clientY) => {
+  const {
+    draggedItemId,
+    filteredItems,
+    itemHeight,
+    y
+  } = state;
+  if (!draggedItemId || !isMovableActivityBarItem(filteredItems.find(item => item.id === draggedItemId))) {
+    return undefined;
+  }
+  const topItems = filteredItems.filter(item => !isBottomItem$2(item));
+  for (let index = 0; index < topItems.length; index++) {
+    const item = topItems[index];
+    const itemY = y + index * itemHeight;
+    if (clientY < itemY || clientY >= itemY + itemHeight) {
+      continue;
+    }
+    if (!isMovableActivityBarItem(item)) {
+      return undefined;
+    }
+    if (item.id === draggedItemId) {
+      return undefined;
+    }
+    const position = clientY < itemY + itemHeight / 2 ? 'before' : 'after';
+    const sourceIndex = topItems.findIndex(candidate => candidate.id === draggedItemId);
+    if (position === 'before' && sourceIndex === index - 1 || position === 'after' && sourceIndex === index + 1) {
+      return undefined;
+    }
+    return {
+      id: item.id,
+      position
+    };
+  }
+  return undefined;
+};
+const handleDragOver = (state, clientY) => {
+  const dropIndicator = getDropIndicator(state, clientY);
+  const {
+    dropIndicator: oldIndicator
+  } = state;
+  if (oldIndicator?.id === dropIndicator?.id && oldIndicator?.position === dropIndicator?.position) {
+    return state;
+  }
+  return {
+    ...state,
+    dropIndicator
+  };
+};
+
+const handleDragStart = (state, id) => {
+  const {
+    dragAndDropEnabled,
+    filteredItems
+  } = state;
+  if (!dragAndDropEnabled || !isMovableActivityBarItem(filteredItems.find(item => item.id === id))) {
+    return state;
+  }
+  return {
+    ...state,
+    draggedItemId: id,
+    dropIndicator: undefined
+  };
+};
+
+const Type = 'application/x-lvce-editor-activity-bar-item';
+const getData = id => `${Type}:${id}`;
+const getId = value => {
+  const prefix = `${Type}:`;
+  return value.startsWith(prefix) ? value.slice(prefix.length) : undefined;
+};
+
+const reorderActivityBarItems = (items, draggedItemId, targetId, position) => {
+  const sourceIndex = items.findIndex(item => item.id === draggedItemId);
+  const targetIndex = items.findIndex(item => item.id === targetId);
+  if (sourceIndex === -1 || targetIndex === -1 || sourceIndex === targetIndex || !isMovableActivityBarItem(items[sourceIndex]) || !isMovableActivityBarItem(items[targetIndex])) {
+    return items;
+  }
+  const result = [...items];
+  const [source] = result.splice(sourceIndex, 1);
+  const newTargetIndex = result.findIndex(item => item.id === targetId);
+  const insertionIndex = newTargetIndex + (position === 'after' ? 1 : 0);
+  result.splice(insertionIndex, 0, source);
+  return result;
+};
+
+const handleDrop = async (context, dropId) => {
+  const state = context.getState();
+  const {
+    activityBarItems: initialActivityBarItems,
+    dragAndDropEnabled,
+    draggedItemId,
+    dropIndicator,
+    filteredItems: initialFilteredItems,
+    focusedIndex: initialFocusedIndex,
+    height,
+    itemHeight,
+    platform,
+    selectedIndex: initialSelectedIndex
+  } = state;
+  const clearState = handleDragEnd(state);
+  if (!dragAndDropEnabled || !draggedItemId || !dropIndicator) {
+    await context.updateState(() => clearState);
+    return;
+  }
+  const isElectron = platform === Electron;
+  const result = await invoke$4('DragAndDrop.getDroppedItemsByDropId', dropId, isElectron);
+  const values = Array.isArray(result?.strings) ? result.strings : [];
+  if (values.length !== 1 || getId(values[0]) !== draggedItemId) {
+    await context.updateState(() => clearState);
+    return;
+  }
+  const activityBarItems = reorderActivityBarItems(initialActivityBarItems, draggedItemId, dropIndicator.id, dropIndicator.position);
+  const filteredItems = getFilteredActivityBarItems(activityBarItems, height, itemHeight);
+  const selectedId = initialActivityBarItems.find(item => item.flags & Selected)?.id;
+  const focusedId = initialFilteredItems[initialFocusedIndex]?.id;
+  await context.updateState(() => ({
+    ...clearState,
+    activityBarItems,
+    filteredItems,
+    focusedIndex: focusedId ? filteredItems.findIndex(item => item.id === focusedId) : initialFocusedIndex,
+    selectedIndex: selectedId ? filteredItems.findIndex(item => item.id === selectedId) : initialSelectedIndex
+  }));
+};
+
 const commandMap$1 = {};
 
 const handleExtensionManagementMessagePort = async port => {
@@ -2576,27 +2776,36 @@ const Search = 'Search';
 const SourceControl = 'Source Control';
 
 const toActivityBarItem = view => {
+  const defaultLocation = view.preferredLocation === 'sideBar' ? SideBar : Default;
   const icon = view.icon || Extensions$1;
-  const customIconUrl = isCustomIconUrl(icon) ? icon : undefined;
-  const customIconClass = customIconUrl ? getCustomIconClass(view.id, customIconUrl) : undefined;
-  const item = {
+  const customIconUrl = isCustomIconUrl(icon) ? icon : '';
+  const customIconClass = customIconUrl ? getCustomIconClass(view.id, customIconUrl) : '';
+  return {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass,
+    customIconUrl,
+    enabled: false,
     flags: Tab | Enabled,
+    hasPopup: false,
     icon,
     id: view.id,
     keyShortcuts: '',
-    ...(view.preferredLocation === 'preview' && {
-      preferredLocation: 'preview'
-    }),
+    preferredLocation: view.preferredLocation === 'preview' ? Preview : defaultLocation,
     title: view.title || view.id
   };
-  if (customIconClass && customIconUrl) {
-    return {
-      ...item,
-      customIconClass,
-      customIconUrl
-    };
+};
+const isBottomItem$1 = item => item.id === 'Account' || item.id === 'Settings';
+const applyExistingOrder = (items, existingItems) => {
+  if (existingItems.length === 0) {
+    return items;
   }
-  return item;
+  const itemsById = new Map(items.map(item => [item.id, item]));
+  const orderedTopItems = existingItems.filter(item => !isBottomItem$1(item)).map(item => itemsById.get(item.id)).filter(item => Boolean(item));
+  const orderedTopIds = new Set(orderedTopItems.map(item => item.id));
+  const newTopItems = items.filter(item => !isBottomItem$1(item) && !orderedTopIds.has(item.id));
+  const bottomItems = items.filter(isBottomItem$1);
+  return [...orderedTopItems, ...newTopItems, ...bottomItems];
 };
 const getActivityBarItems = (state, contributedViews = []) => {
   const {
@@ -2608,61 +2817,117 @@ const getActivityBarItems = (state, contributedViews = []) => {
   const items = [
   // Top
   {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: Tab | Enabled,
+    hasPopup: false,
     icon: Files,
     id: Explorer,
     keyShortcuts: 'Control+Shift+E',
+    preferredLocation: Default,
     title: explorer()
   }, {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: Tab | Enabled,
+    hasPopup: false,
     icon: Search$1,
     id: Search,
     keyShortcuts: 'Control+Shift+F',
+    preferredLocation: Default,
     title: search()
   }, {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: Tab | Enabled,
+    hasPopup: false,
     icon: SourceControl$1,
     id: SourceControl,
     keyShortcuts: 'Control+Shift+G',
+    preferredLocation: Default,
     title: sourceControl()
   }, {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: Tab | Enabled,
+    hasPopup: false,
     icon: DebugAlt2,
     id: RunAndDebug,
     keyShortcuts: 'Control+Shift+D',
+    preferredLocation: Default,
     title: runAndDebug()
   }, {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: Tab | Enabled,
+    hasPopup: false,
     icon: Extensions$1,
     id: Extensions,
     keyShortcuts: 'Control+Shift+X',
+    preferredLocation: Default,
     title: extensions()
   }, {
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: Tab | (referencesEnabled ? Enabled : 0),
+    hasPopup: false,
     icon: References$1,
     id: References,
     keyShortcuts: '',
+    preferredLocation: Default,
     title: references()
   }, ...contributedViews.map(toActivityBarItem)
   // Bottom
   ];
   if (accountEnabled) {
     items.push({
+      badgeIcon: '',
+      badgeText: '',
+      customIconClass: '',
+      customIconUrl: '',
+      enabled: false,
       flags: Button | Enabled | MarginTop,
+      hasPopup: true,
       icon: Account,
       id: 'Account',
       keyShortcuts: '',
+      preferredLocation: Default,
       title: account()
     });
   }
   items.push({
+    badgeIcon: '',
+    badgeText: '',
+    customIconClass: '',
+    customIconUrl: '',
+    enabled: false,
     flags: settingsFlags,
+    hasPopup: true,
     icon: SettingsGear,
     id: 'Settings',
     keyShortcuts: '',
+    preferredLocation: Default,
     title: settings()
   });
-  return items;
+  return applyExistingOrder(items, activityBarItems);
 };
 
 const getContributedViews = async platform => {
@@ -2743,6 +3008,9 @@ const isConnected = () => {
 const invoke = (method, ...params) => {
   return invoke$2(method, ...params);
 };
+const invokeAndTransfer = (method, ...params) => {
+  return invokeAndTransfer$2(method, ...params);
+};
 const set = rpc => {
   set$2(rpc);
   state.connected = true;
@@ -2799,17 +3067,28 @@ const getAccountEnabled = async defaultValue => {
   }
 };
 
+const getDragAndDropEnabled = async defaultValue => {
+  try {
+    const value = await invoke$1('Preferences.get', 'activityBar.dragAndDropEnabled');
+    return typeof value === 'boolean' ? value : defaultValue;
+  } catch {
+    return defaultValue;
+  }
+};
+
 const handleSettingsChanged = async state => {
   const {
     accountEnabled: currentAccountEnabled,
+    dragAndDropEnabled: currentDragAndDropEnabled,
     height,
     itemHeight,
     platform
   } = state;
-  const [accountEnabled, contributedViews, sidebarLocation] = await Promise.all([getAccountEnabled(currentAccountEnabled), getContributedViews(platform), getSideBarPosition()]);
+  const [accountEnabled, dragAndDropEnabled, contributedViews, sidebarLocation] = await Promise.all([getAccountEnabled(currentAccountEnabled), getDragAndDropEnabled(Boolean(currentDragAndDropEnabled)), getContributedViews(platform), getSideBarPosition()]);
   const newState = {
     ...state,
-    accountEnabled
+    accountEnabled,
+    dragAndDropEnabled
   };
   const items = getActivityBarItems(newState, contributedViews);
   const activeViewIds = resolveActiveViewIds(state, items);
@@ -2930,11 +3209,12 @@ const getActiveView = async () => {
 };
 
 const loadPreferences = async (accountEnabled, platform) => {
-  const [accountEnabledNew, activeView, contributedViews, sidebarLocation, sideBarVisible] = await Promise.all([getAccountEnabled(accountEnabled), getActiveView(), getContributedViews(platform), getSideBarPosition(), getSideBarVisible()]);
+  const [accountEnabledNew, dragAndDropEnabled, activeView, contributedViews, sidebarLocation, sideBarVisible] = await Promise.all([getAccountEnabled(accountEnabled), getDragAndDropEnabled(false), getActiveView(), getContributedViews(platform), getSideBarPosition(), getSideBarVisible()]);
   return {
     accountEnabled: accountEnabledNew,
     activeView,
     contributedViews,
+    dragAndDropEnabled,
     sidebarLocation,
     sideBarVisible
   };
@@ -2977,28 +3257,39 @@ const loadContent = async state => {
   };
 };
 
-const escapeCssUrl = url => {
-  return url.replaceAll('\\', '\\\\').replaceAll('"', '\\"').replaceAll('\n', '\\a ').replaceAll('\r', '\\d ').replaceAll('\f', '\\c ');
-};
-
-const getCustomIconCss = items => {
+const getCustomIconItems = items => {
   const seen = new Set();
-  let css = '';
-  for (const item of items) {
+  return items.filter(item => {
     const {
       customIconClass,
       customIconUrl
     } = item;
     if (!customIconClass || !customIconUrl || seen.has(customIconClass)) {
-      continue;
+      return false;
     }
     seen.add(customIconClass);
-    css += `.${customIconClass} {
+    return true;
+  });
+};
+
+const escapeCssUrl = url => {
+  return url.replaceAll('\\', '\\\\').replaceAll('"', '\\"').replaceAll('\n', '\\a ').replaceAll('\r', '\\d ').replaceAll('\f', '\\c ');
+};
+
+const getCustomIconRule = item => {
+  const {
+    customIconClass,
+    customIconUrl
+  } = item;
+  return `.${customIconClass} {
   mask-image: url("${escapeCssUrl(customIconUrl)}");
-}
-`;
-  }
-  return css;
+}`;
+};
+
+const getCustomIconCss = items => {
+  const customIconItems = getCustomIconItems(items);
+  const cssRules = customIconItems.map(getCustomIconRule);
+  return cssRules.join('\n');
 };
 
 const getCss = (itemHeight, items = []) => {
@@ -3018,6 +3309,25 @@ const renderCss = (oldState, newState) => {
   return [SetCss, uid, css];
 };
 
+const renderDragData = (_oldState, newState) => {
+  const {
+    draggedItemId,
+    filteredItems,
+    uid
+  } = newState;
+  const item = filteredItems.find(candidate => candidate.id === draggedItemId);
+  if (!draggedItemId || !item) {
+    return [];
+  }
+  return ['Viewlet.setDragData', uid, {
+    items: [{
+      data: getData(draggedItemId),
+      type: Type
+    }],
+    label: item.title
+  }];
+};
+
 const ActivityBar$1 = 'ActivityBar';
 
 const renderFocus = (oldState, newState) => {
@@ -3325,9 +3635,14 @@ const HandleBlur = 1;
 const HandleContextMenu = 2;
 const HandleFocus = 3;
 const HandleMouseDown = 4;
+const HandleDragOver = 5;
+const HandleDragLeave = 6;
+const HandleDrop = 7;
+const HandleDragStart = 8;
+const HandleDragEnd = 9;
 
 const getActivityBarItemHasPopup = item => {
-  return item.id === 'Account' || item.id === 'Settings';
+  return item.hasPopup;
 };
 
 const getAriaSelected = (isTab, isSelected) => {
@@ -3455,7 +3770,13 @@ const getIconVirtualDom = (icon, type = Div, customIconClass = '') => {
   };
 };
 
-const getActivityBarItemVirtualDom = item => {
+const getDropIndicatorStyle = (dropIndicator, id) => {
+  if (!dropIndicator || dropIndicator.id !== id) {
+    return undefined;
+  }
+  return dropIndicator.position === 'before' ? 'box-shadow:inset 0 2px 0 white;' : 'box-shadow:inset 0 -2px 0 white;';
+};
+const getActivityBarItemVirtualDom = (item, draggable = false, dropIndicator) => {
   const {
     badgeText,
     flags,
@@ -3472,8 +3793,9 @@ const getActivityBarItemVirtualDom = item => {
   const ariaSelected = getAriaSelected(isTab, isSelected);
   const marginTop = flags & MarginTop;
   const className = getClassName(isFocused, marginTop, isSelected);
+  let dom;
   if (isSelected && !badgeText) {
-    return [{
+    dom = [{
       ariaHasPopup,
       ariaSelected,
       childCount: 1,
@@ -3486,36 +3808,47 @@ const getActivityBarItemVirtualDom = item => {
       ...getIconVirtualDom(icon, Div, item.customIconClass),
       name: id
     }];
+  } else if (isProgress) {
+    dom = getActivityBarItemInProgressDom(item);
+  } else if (badgeText) {
+    dom = getActivityBarItemWithBadgeDom(item);
+  } else {
+    dom = [{
+      ariaHasPopup,
+      ariaSelected,
+      childCount: 0,
+      className: mergeClassNames(className, getIconClass(item, 'Icon')),
+      name: id,
+      role,
+      title,
+      type: Div
+    }];
   }
-
-  // TODO support progress on selected activity bar item
-  if (isProgress) {
-    return getActivityBarItemInProgressDom(item);
-  }
-  if (badgeText) {
-    return getActivityBarItemWithBadgeDom(item);
-  }
+  const [root, ...children] = dom;
   return [{
-    ariaHasPopup,
-    ariaSelected,
-    childCount: 0,
-    className: mergeClassNames(className, getIconClass(item, 'Icon')),
-    name: id,
-    role,
-    title,
-    type: Div
-  }];
+    ...root,
+    ...(draggable && {
+      draggable: true
+    }),
+    ...(draggable && {
+      onDragEnd: HandleDragEnd,
+      onDragStart: HandleDragStart
+    }),
+    ...(getDropIndicatorStyle(dropIndicator, id) && {
+      style: getDropIndicatorStyle(dropIndicator, id)
+    })
+  }, ...children];
 };
 
-const getVirtualDom = visibleItems => {
-  const dom = visibleItems.flatMap(getActivityBarItemVirtualDom);
+const getVirtualDom = (visibleItems, dragAndDropEnabled = false, dropIndicator) => {
+  const dom = visibleItems.flatMap(item => getActivityBarItemVirtualDom(item, dragAndDropEnabled && isMovableActivityBarItem(item), dropIndicator));
   return dom;
 };
 
 const Focusable = 0;
 
 const className = mergeClassNames(Viewlet, ActivityBar);
-const getActivityBarVirtualDom = visibleItems => {
+const getActivityBarVirtualDom = (visibleItems, dragAndDropEnabled = false, dropIndicator) => {
   return [{
     ariaOrientation: Vertical,
     ariaRoleDescription: activityBar(),
@@ -3524,12 +3857,15 @@ const getActivityBarVirtualDom = visibleItems => {
     id: ActivityBar$1,
     onBlur: HandleBlur,
     onContextMenu: HandleContextMenu,
+    onDragLeave: HandleDragLeave,
+    onDragOver: HandleDragOver,
+    onDrop: HandleDrop,
     onFocus: HandleFocus,
     onMouseDown: HandleMouseDown,
     role: ToolBar,
     tabIndex: Focusable,
     type: Div
-  }, ...getVirtualDom(visibleItems)];
+  }, ...getVirtualDom(visibleItems, dragAndDropEnabled, dropIndicator)];
 };
 
 const getVisibleActivityBarItems = (items, focusedIndex) => {
@@ -3538,6 +3874,8 @@ const getVisibleActivityBarItems = (items, focusedIndex) => {
 
 const renderItems = (oldState, newState) => {
   const {
+    dragAndDropEnabled,
+    dropIndicator,
     filteredItems,
     focused,
     focusedIndex,
@@ -3548,7 +3886,7 @@ const renderItems = (oldState, newState) => {
     return [SetDom2, uid, []];
   }
   const visibleItems = getVisibleActivityBarItems(filteredItems, focused ? focusedIndex : -1);
-  const dom = getActivityBarVirtualDom(visibleItems);
+  const dom = getActivityBarVirtualDom(visibleItems, Boolean(dragAndDropEnabled), dropIndicator);
   return [SetDom2, uid, dom];
 };
 
@@ -3566,6 +3904,8 @@ const getRenderer = diffType => {
   switch (diffType) {
     case RenderCss:
       return renderCss;
+    case RenderDragData:
+      return renderDragData;
     case RenderFocus:
       return renderFocus;
     case RenderFocusContext:
@@ -3602,7 +3942,7 @@ const render2 = (uid, diffResult) => {
     newState,
     oldState
   } = get$2(uid);
-  set$5(uid, newState, newState);
+  set$6(uid, newState, newState);
   const commands = applyRender(oldState, newState, diffResult);
   if (!isConnected()) {
     return commands;
@@ -3611,6 +3951,7 @@ const render2 = (uid, diffResult) => {
 };
 
 const renderEventListeners = () => {
+  const DropId = 'event.dropId';
   return [{
     name: HandleBlur,
     params: ['handleBlur']
@@ -3626,6 +3967,25 @@ const renderEventListeners = () => {
     params: ['handleClick', Button$1, ClientX, ClientY, TargetName],
     preventDefault: false,
     stopPropagation: false
+  }, {
+    name: HandleDragOver,
+    params: ['handleDragOver', ClientY],
+    preventDefault: true
+  }, {
+    name: HandleDragLeave,
+    params: ['handleDragLeave']
+  }, {
+    name: HandleDrop,
+    params: ['handleDrop', DropId],
+    preventDefault: true
+  }, {
+    // @ts-ignore
+    dragEffect: 'move',
+    name: HandleDragStart,
+    params: ['handleDragStart', TargetName]
+  }, {
+    name: HandleDragEnd,
+    params: ['handleDragEnd']
   }];
 };
 
@@ -3633,6 +3993,7 @@ const createDefaultState = () => ({
   accountEnabled: true,
   activityBarItems: [],
   currentViewletId: '',
+  dragAndDropEnabled: false,
   filteredItems: [],
   focus: 0,
   focused: false,
@@ -3750,6 +4111,19 @@ const setAccountEnabled = (state, enabled) => {
   };
 };
 
+const setDragAndDropEnabled = (state, enabled) => {
+  const {
+    dragAndDropEnabled
+  } = state;
+  if (dragAndDropEnabled === enabled) {
+    return state;
+  }
+  return {
+    ...state,
+    dragAndDropEnabled: enabled
+  };
+};
+
 const providerKeys = ['userLoginProvider', 'loginProvider', 'authProvider', 'provider'];
 const getUserLoginProvider = userInfo => {
   if (!userInfo || typeof userInfo !== 'object') {
@@ -3815,7 +4189,7 @@ const toggleActivityBarItem = async (state, itemId) => {
 };
 
 const wakeUp = sleepState => {
-  set$5(sleepState.uid, sleepState, sleepState);
+  set$6(sleepState.uid, sleepState, sleepState);
 };
 
 const handleDirectMessagePort = (port, setAsRendererProcess) => handleMessagePort(port, commandMap, setAsRendererProcess);
@@ -3845,6 +4219,11 @@ const commandMap = {
   'ActivityBar.handleClickSignIn': wrapCommand(handleClickSignIn),
   'ActivityBar.handleClickSignOut': wrapCommand(handleClickSignOut),
   'ActivityBar.handleContextMenu': wrapAsyncCommand(handleContextMenu),
+  'ActivityBar.handleDragEnd': wrapCommand(handleDragEnd),
+  'ActivityBar.handleDragLeave': wrapCommand(handleDragLeave),
+  'ActivityBar.handleDragOver': wrapCommand(handleDragOver),
+  'ActivityBar.handleDragStart': wrapCommand(handleDragStart),
+  'ActivityBar.handleDrop': wrapAsyncCommand(handleDrop),
   'ActivityBar.handleExtensionManagementMessagePort': handleExtensionManagementMessagePort,
   'ActivityBar.handleExtensionsChanged': wrapCommand(handleExtensionsChanged),
   'ActivityBar.handleFocus': wrapCommand(handleFocus),
@@ -3860,6 +4239,7 @@ const commandMap = {
   'ActivityBar.saveState': wrapGetter(saveState),
   'ActivityBar.selectCurrent': wrapCommand(selectCurrent),
   'ActivityBar.setAccountEnabled': wrapCommand(setAccountEnabled),
+  'ActivityBar.setDragAndDropEnabled': wrapCommand(setDragAndDropEnabled),
   'ActivityBar.setUserLoginState': wrapCommand(setUserLoginState),
   'ActivityBar.sleep': sleep,
   'ActivityBar.terminate': terminate,
@@ -3867,6 +4247,20 @@ const commandMap = {
   'ActivityBar.wakeUp': wakeUp
 };
 
+const send$1 = async port => {
+  await invokeAndTransfer('DragAndDrop.handleMessagePort', port);
+};
+const createDragAndDropWorkerRpc = async () => {
+  return create$2({
+    commandMap: {},
+    send: send$1
+  });
+};
+
+const initializeDragAndDropWorker = async () => {
+  set$4(await createDragAndDropWorkerRpc());
+};
+
 const send = async port => {
   await sendMessagePortToExtensionManagementWorker(port, 0);
 };
@@ -3887,7 +4281,7 @@ const initializeRendererWorker = async () => {
 
 const listen = async () => {
   registerCommands(commandMap);
-  await Promise.all([initializeRendererWorker(), initializeExtensionManagementWorker()]);
+  await Promise.all([initializeRendererWorker(), initializeExtensionManagementWorker(), initializeDragAndDropWorker()]);
 };
 
 const main = async () => {

package/dist/settings.json

@@ -6,5 +6,13 @@
     "id": "activityBar.accountEnabled",
     "type": "boolean",
     "value": true
+  },
+  {
+    "category": "workbench",
+    "description": "Enable dragging activity bar items to reorder them",
+    "heading": "Activity Bar",
+    "id": "activityBar.dragAndDropEnabled",
+    "type": "boolean",
+    "value": false
   }
 ]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/activity-bar-worker",
-  "version": "7.26.0",
+  "version": "7.27.1",
   "description": "Explorer Worker",
   "repository": {
     "type": "git",