enables transforms for groups

packages/tldraw/src/state/session/sessions/transform/transform.session.spec.ts

@@ -186,4 +186,35 @@ describe('Transform session', () => {
   describe('when transforming from the left edge', () => {
     // Todo
   })
+
+  describe('when transforming a group', () => {
+    it('transforms the groups children', () => {
+      const tlstate = new TLDrawState()
+      tlstate
+        .loadDocument(mockDocument)
+        .group(['rect1', 'rect2'], 'groupA')
+        .select('groupA')
+        .startTransformSession([0, 0], TLBoundsCorner.TopLeft)
+        .updateTransformSession([10, 10])
+        .completeSession()
+
+      expect(getShapeBounds(tlstate, 'rect1')).toMatchObject({
+        minX: 10,
+        minY: 10,
+        maxX: 105,
+        maxY: 105,
+        width: 95,
+        height: 95,
+      })
+
+      expect(getShapeBounds(tlstate, 'rect2')).toMatchObject({
+        minX: 105,
+        minY: 105,
+        maxX: 200,
+        maxY: 200,
+        width: 95,
+        height: 95,
+      })
+    })
+  })
 })

packages/tldraw/src/state/tlstate.ts

@@ -249,7 +249,7 @@ export class TLDrawState extends StateManager<Data> {
               children
                 .map((id) => page.shapes[id])
                 .filter(Boolean)
-                .map((shape) => TLDR.getBounds(shape))
+                .map((shape) => TLDR.getRotatedBounds(shape))
             )
 
             page.shapes[group.id] = {
@@ -1423,7 +1423,11 @@ export class TLDrawState extends StateManager<Data> {
       return this.startSession(new Sessions.RotateSession(this.state, point))
     }
 
-    if (this.selectedIds.length === 1) {
+    const idsToTransform = selectedIds.flatMap((id) =>
+      TLDR.getDocumentBranch(this.state, id, this.currentPageId)
+    )
+
+    if (idsToTransform.length === 1) {
       return this.startSession(
         new Sessions.TransformSingleSession(this.state, point, this.pointedBoundsHandle, commandId)
       )