@lvce-editor/main-area-worker 1.6.0 → 1.7.0

package/dist/mainAreaWorkerMain.js

@@ -1256,8 +1256,44 @@ const handleClickCloseTab = (state, groupId, tabId) => {
 };
 
 const handleClickTab = async (state, groupIndex, index) => {
-  // TODO mark that tab as active (if it is a valid group index and index)
-  return state;
+  const {
+    layout
+  } = state;
+  const {
+    groups
+  } = layout;
+
+  // Validate indexes
+  if (groupIndex < 0 || groupIndex >= groups.length) {
+    return state;
+  }
+  const group = groups[groupIndex];
+  if (index < 0 || index >= group.tabs.length) {
+    return state;
+  }
+  const tab = group.tabs[index];
+  const groupId = group.id;
+  const tabId = tab.id;
+
+  // Return same state if this group and tab are already active
+  if (layout.activeGroupId === groupId && group.activeTabId === tabId) {
+    return state;
+  }
+
+  // Update the groups array with the new active tab and active group
+  const updatedGroups = groups.map((g, i) => ({
+    ...g,
+    activeTabId: i === groupIndex ? tabId : g.activeTabId,
+    focused: i === groupIndex
+  }));
+  return {
+    ...state,
+    layout: {
+      ...layout,
+      activeGroupId: groupId,
+      groups: updatedGroups
+    }
+  };
 };
 
 const id = 7201;
@@ -1360,10 +1396,12 @@ const HandleClick = 11;
 const HandleClickClose = 12;
 const HandleClickTab = 13;
 
-const renderTab = (tab, isActive) => {
+const renderTab = (tab, isActive, tabIndex, groupIndex) => {
   return [{
     childCount: 2,
-    className: isActive ? 'MainTab MainTabActive' : 'MainTab',
+    className: isActive ? 'MainTab MainTabSelected' : 'MainTab',
+    'data-group-index': groupIndex,
+    'data-index': tabIndex,
     onClick: HandleClickTab,
     type: Div
   }, {
@@ -1378,21 +1416,21 @@ const renderTab = (tab, isActive) => {
   }, text('×')];
 };
 
-const renderTabBar = group => {
+const renderTabBar = (group, groupIndex) => {
   return [{
     childCount: group.tabs.length,
     className: 'MainTabs',
     type: Div
-  }, ...group.tabs.flatMap(tab => renderTab(tab, tab.id === group.activeTabId))];
+  }, ...group.tabs.flatMap((tab, tabIndex) => renderTab(tab, tab.id === group.activeTabId, tabIndex, groupIndex))];
 };
 
-const renderEditorGroup = group => {
+const renderEditorGroup = (group, groupIndex) => {
   const activeTab = group.tabs.find(tab => tab.id === group.activeTabId);
   return [{
     childCount: 2,
     className: 'EditorGroup',
     type: Div
-  }, ...renderTabBar(group), {
+  }, ...renderTabBar(group, groupIndex), {
     childCount: activeTab ? 1 : 1,
     className: 'EditorContainer',
     type: Div
@@ -1408,7 +1446,7 @@ const getMainAreaVirtualDom = layout => {
     childCount: layout.groups.length,
     className: CSS_CLASSES.EDITOR_GROUPS_CONTAINER,
     type: Div
-  }, ...layout.groups.flatMap(renderEditorGroup)];
+  }, ...layout.groups.flatMap((group, groupIndex) => renderEditorGroup(group, groupIndex))];
 };
 
 const renderItems = (oldState, newState) => {
@@ -1459,7 +1497,7 @@ const renderEventListeners = () => {
     name: HandleClickClose,
     params: ['handleClickCloseTab', 'event.target.dataset.groupIndex', 'event.target.dataset.index']
   }, {
-    name: HandleClickClose,
+    name: HandleClickTab,
     params: ['handleClickTab', 'event.target.dataset.groupIndex', 'event.target.dataset.index']
   }];
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/main-area-worker",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "Main Area Worker",
   "repository": {
     "type": "git",