fix: change the way region align works

tests/core/region.test.ts

@@ -159,14 +159,14 @@ describe('Region', () => {
             
             applyAlign(region);
             
-            // 第一轴 (x, axisIndex=0) 对齐：
-            // 排序：part3(x=2), part1(x=5), part2(x=7) → children=[part3, part1, part2]
-            // 对齐：part3.position[0]=0, part1.position[0]=1, part2.position[0]=2
+            // X 轴对齐：
+            // 唯一位置值：[2, 5, 7] -> 映射到 [0, 1, 2]
+            // part3: 2->0, part1: 5->1, part2: 7->2
             // 结果：part3=[0,30], part1=[1,10], part2=[2,20]
             //
-            // 第二轴 (y, axisIndex=1) 对齐：
-            // 排序：part1(y=10), part2(y=20), part3(y=30) → children=[part1, part2, part3]
-            // 对齐：part1.position[1]=0, part2.position[1]=1, part3.position[1]=2
+            // Y 轴对齐：
+            // 唯一位置值：[10, 20, 30] -> 映射到 [0, 1, 2]
+            // part1: 10->0, part2: 20->1, part3: 30->2
             // 最终：part1=[1,0], part2=[2,1], part3=[0,2]
             
             const positions = region.children.map(c => ({
@@ -174,15 +174,62 @@ describe('Region', () => {
                 position: c.value.position
             }));
             
-            // children 按 y 轴排序后的顺序
+            // children 按位置排序后的顺序
+            expect(positions[0].id).toBe('p3');
+            expect(positions[0].position).toEqual([0, 2]);
+            
+            expect(positions[1].id).toBe('p1');
+            expect(positions[1].position).toEqual([1, 0]);
+            
+            expect(positions[2].id).toBe('p2');
+            expect(positions[2].position).toEqual([2, 1]);
+        });
+
+        it('should align 4 elements on rectangle corners', () => {
+            // 4 个元素放在矩形的四个角：(0,0), (10,0), (10,1), (0,1)
+            // 期望：保持矩形布局，只是紧凑到 (0,0), (1,0), (1,1), (0,1)
+            const part1 = createPart('p1', [0, 0]);   // 左下角
+            const part2 = createPart('p2', [10, 0]);  // 右下角
+            const part3 = createPart('p3', [10, 1]);  // 右上角
+            const part4 = createPart('p4', [0, 1]);   // 左上角
+            
+            const region = createRegion(
+                [
+                    { name: 'x', min: 0, max: 10, align: 'start' },
+                    { name: 'y', min: 0, max: 10, align: 'start' }
+                ],
+                [part1, part2, part3, part4]
+            );
+            
+            applyAlign(region);
+            
+            // X 轴对齐：
+            // 唯一位置值：[0, 10] -> 映射到 [0, 1]
+            // part1: 0->0, part4: 0->0, part2: 10->1, part3: 10->1
+            // 结果：part1=[0,0], part4=[0,1], part2=[1,0], part3=[1,1]
+            //
+            // Y 轴对齐：
+            // 唯一位置值：[0, 1] -> 映射到 [0, 1] (已经是紧凑的)
+            // part1: 0->0, part2: 0->0, part4: 1->1, part3: 1->1
+            // 最终：part1=[0,0], part2=[1,0], part4=[0,1], part3=[1,1]
+            
+            const positions = region.children.map(c => ({
+                id: c.value.id,
+                position: c.value.position
+            }));
+            
+            // children 按位置排序后的顺序：(0,0), (0,1), (1,0), (1,1)
             expect(positions[0].id).toBe('p1');
-            expect(positions[0].position).toEqual([1, 0]);
+            expect(positions[0].position).toEqual([0, 0]);
             
-            expect(positions[1].id).toBe('p2');
-            expect(positions[1].position).toEqual([2, 1]);
+            expect(positions[1].id).toBe('p4');
+            expect(positions[1].position).toEqual([0, 1]);
             
-            expect(positions[2].id).toBe('p3');
-            expect(positions[2].position).toEqual([0, 2]);
+            expect(positions[2].id).toBe('p2');
+            expect(positions[2].position).toEqual([1, 0]);
+            
+            expect(positions[3].id).toBe('p3');
+            expect(positions[3].position).toEqual([1, 1]);
         });
     });