actionPane 支持 index

packages/demo/src/vision/index.ts

@@ -140,20 +140,20 @@ function initDemoPanes() {
       children: '保存',
     }),
   });
-  skeleton.add({
+  // skeleton.add({
-    area: 'topArea',
+  //   area: 'topArea',
-    type: 'Dock',
+  //   type: 'Dock',
-    name: 'preview4',
+  //   name: 'preview4',
-    props: {
+  //   props: {
-      align: 'center',
+  //     align: 'center',
-    },
+  //   },
-    content: createElement('img', {
+  //   content: createElement('img', {
-      src: 'https://img.alicdn.com/tfs/TB1WW.VC.z1gK0jSZLeXXb9kVXa-486-64.png',
+  //     src: 'https://img.alicdn.com/tfs/TB1WW.VC.z1gK0jSZLeXXb9kVXa-486-64.png',
-      style: {
+  //     style: {
-        height: 32,
+  //       height: 32,
-      },
+  //     },
-    }),
+  //   }),
-  });
+  // });
   skeleton.add({
     area: 'topArea',
     type: 'Dock',

packages/editor-skeleton/src/layouts/top-area.tsx

@@ -24,7 +24,11 @@ class Contents extends Component<{ area: Area }> {
     const left: any[] = [];
     const center: any[] = [];
     const right: any[] = [];
-    area.container.items.forEach(item => {
+    area.container.items.sort((a,b) => {
+      const index1 = a.config?.index || 0;
+      const index2 = b.config?.index || 0;
+      return index1 === index2 ? 0 : (index1 > index2 ? 1 : -1);
+    }).forEach(item => {
       if (item.align === 'center') {
         center.push(item.content);
       } else if (item.align === 'left') {

packages/vision-preset/src/panes.ts

@@ -63,7 +63,7 @@ function upgradeConfig(config: OldPaneConfig): IWidgetBaseConfig & { area: strin
       onDestroy: destroy,
     },
     contentProps: props,
-    index,
+    index: props?.index,
   };
   if (type === 'dock') {
     newConfig.type = 'PanelDock';